Commit aeda1cde authored by 邹馨樟's avatar 邹馨樟

add note

parent e38260f9
## 做过的项目有什么亮点,工作中遇到的比较困难的问题 ## 爪哇教育@字节3-1详解最新大厂前端核心面试题-路白
<iframe src="https://xbeibeix.com/api/bilibili/biliplayer/?url=https://www.bilibili.com/video/BV1zy4y1J7Sf" allowfullscreen="allowfullscreen" width="100%" height="500" scrolling="no" frameborder="0" sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"></iframe>
### 做过的项目有什么亮点,工作中遇到的比较困难的问题
面试官要看一下你解决问题的能力 面试官要看一下你解决问题的能力
## 你了解浏览器的事件循环么 ### 你了解浏览器的事件循环么
1. 为什么js在浏览器中有事件循环的机制? 1. 为什么js在浏览器中有事件循环的机制?
...@@ -40,20 +44,3 @@ event loop ...@@ -40,20 +44,3 @@ event loop
│ ┌─────────────┴─────────────┐ │ ┌─────────────┴─────────────┐
└──┤ close callbacks │ └──┤ close callbacks │
└───────────────────────────┘ └───────────────────────────┘
script start
async1 start
async2
async1 end
promise1
script end
promise2
setTimeout
\ No newline at end of file
![网络加载导图](./public/line.png) ![网络加载导图](./public/line.png)
1. 尽量减少HTTP请求数
2. 减少DNS查找
3. 避免重定向
4. 让Ajax可缓存
5. 延迟加载组件
6. 预加载组件
7. 减少DOM元素的数量
8. 跨域分离组件
9. 尽量少用iframe
10. 杜绝404
11. 避免使用CSS表达式
12. 选择<link>舍弃@import
13. 避免使用滤镜
14. 把样式表放在顶部
15. 去除重复脚本
16. 尽量减少DOM访问
17. 用智能的事件处理器
18. 把脚本放在底部
19. 把JavaScript和CSS放到外面
20. 压缩JavaScript和CSS
21. 优化图片
22. 优化CSS Sprite
23. 不要用HTML缩放图片
24. 用小的可缓存的favicon.ico(P.S. 收藏夹图标)
25. 给Cookie减肥
26. 把组件放在不含cookie的域下
27. 保证所有组件都小于25K
28. 把组件打包到一个复合文档里
29. Gzip组件
30. 避免图片src属性为空
31. 配置ETags
32. 对Ajax用GET请求
33. 尽早清空缓冲区(Bigpipe)
34. 使用CDN(内容分发网络)
35. 添上Expires或者Cache-Control HTTP头
![网络加载导图](./public/round.png)
1. loading 加载阶段 网络通信和html解析
2. scripting javascript执行
3. rendering 重排阶段 样式计算和布局 css
4. painting 重绘阶段
5. other 其他事件花费的时间
6. idle 空闲时间
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment