04.09
1. 如何写“好”JavaScript(月影)
1.1 各司其职
- HTML:负责结构功能(Structural)
- CSS:负责表现功能(Presentational)
- JavaScript:负责行为功能(Behavioral)
1.2 复杂UI组件的设计
对于京东轮播图怎么进行设计?可使用以下步骤:
- 结构设计
- API设计
- 控制流设计
优化:
- 插件/依赖注入 降低耦合度
- 改进插件/模板化 将html和组件封装
- 组件模型抽象
1.3 局部细节控制
- 过程抽象,创建once
- 节流防抖
2. Web标准:前端的原力(李松峰)
-
HTTP2.0和HTTP1.X相比的新特性
-
新的二进制格式(Binary Format),HTTP1.x的解析是基于文本。基于文本协议的格式解析存在天然缺陷,文本的表现形式有多样性,要做到健壮性考虑的场景必然很多,二进制则不同,只认0和1的组合。基于这种考虑HTTP2.0的协议解析决定采用二进制格式,实现方便且健壮。
-
多路复用(MultiPlexing),即连接共享,即每一个request都是是用作连接共享机制的。一个request对应一个id,这样一个连接上可以有多个request,每个连接的request可以随机的混杂在一起,接收方可以根据request的 id将request再归属到各自不同的服务端请求里面。
-
header压缩,如上文中所言,对前面提到过HTTP1.x的header带有大量信息,而且每次都要重复发送,HTTP2.0使用encoder来减少需要传输的header大小,通讯双方各自cache一份header fields表,既避免了重复header的传输,又减小了需要传输的大小。
-
服务端推送(server push),同SPDY一样,HTTP2.0也具有server push功能。
-
3. 前端常用的HTTP知识(李成银)
3.1 请求类型
- GET:获取一个资源内容
- POST:新增一个资源
- PUT:更新资源内容
- DELETE:删除资源
- OPTIONS:根据返回判断是否有对其请求的权限
- HEAD:只返回head,不返回实体内容
- PATCH:更新部分内容
3.2 状态码
- 1**:请求已接受,需要继续处理
- 2**:请求已经正确处理
- 3**:重定向
- 4**:客户端错误
- 5**:服务器端错误
3.3 Cookie安全策略
(XSS 漏洞盗取 Cookie,设置 httponly,CSRF 漏洞,设置 token/samesite)
- path
- domain (hostonly*)
- expires (max-age)
- secure
- httponly(js无法获得cookie)
- SameSite
3.4 session
- 服务器侧对应为 Session,基于 Cookie 存放用户信息
- Cookie 有效期为 Session(随浏览器进程退出而失效)
3.5 Content-Type
请求: