前端星——JavaScript / Web标准 / HTTP

JavaScript

1. 各司其职：JavaScript只做状态管理
2. 插件/模板化/抽象
   如何实现轮播图
   • 图片结构是一个列表型结构，所以主体用ul标签；
   • 使用css绝对定位将图片重叠在同一个位置；
   • 轮播图切换的状态使用修饰符（modifier）；
   • 轮播图的切换动画使用 css transition。
     -. 优化1：采用依赖注入降低代码的耦合度
     -. 优化2：改进插件/模板化

     this.container.innerHTML = this.render();
     

   • 优化3：组件模型抽象
3. 过程抽象
4. 声明式 vs 指令式
5. 高阶函数（返回函数的函数）
   once throttle debounced consumer iterative toggle

Web标准

1. HTTP
   • HTTP/0.9：只有GET
   • HTTP/1.0：加入POST；状态码；请求和响应格式变化
   • HTTP/1.1：持久连接；分块；管道机制
   • TLS
   • HTTP/2：二进制协议；多工；数据流；头信息压缩；服务器推送
2. whatwg // HTML5设计原理

HTTP

1. 状态码
   • 1xx：请求已接受，需要继续处理
   • 2xx：请求已正确处理
   • 3xx：重定向
   • 4xx：客户端错误
   • 5xx：服务端错误
2. cookie安全策略
   • path
   • domain(hostonly*)
   • expires(max-age)
   • secure
   • httponly
   • SameSite
   • XSS漏洞盗取Cookie，设置httponly
   • CSRF漏洞，设置token/samesite
3. 性能优化
   • keep-alive
   • 减少网络传输大小
   • 缓存
   • http2/http3