性能优化-css，js的加载与执行
2024-09-05 20:07:24
前端性能优化
css，js的加载与执行
javascript是单线程的
一个网站在浏览器是如何进行渲染的呢？
html页面加载渲染的过程
html渲染过程的一些特点
- 顺序执行，并发加载
- 词法分析
- 并发加载
- 并发上限
- 是否阻塞
- 依赖关系
- 引入方式
css阻塞
- css head中阻塞页面的渲染
- css阻塞js的执行
- css不阻塞外部脚本的加载
js阻塞
- 直接引入的js阻塞页面的渲染
- js不阻塞资源的加载
- js顺序执行，阻塞后续js逻辑的执行
依赖关系
- 页面渲染依赖于css的加载
- js的执行顺序的依赖关系
- js逻辑对于DOM节点的依赖关系
js引入方式
- 直接引入
- defer
- async
- 异步动态引入js
加载和执行的一些优点
- css样式表置顶
- 用link代替import
- js脚本置地
- 合理使用js的异步加载能力
可以使用Chrome浏览器的performance工具分析页面的加载过程
最新文章
- MVC3.0删除数据的时候给提示信息
- 一些java方法，一些感想
- .net微信公众号开发——模板消息
- MVC初学 - The type or namespace name 'DbContext' could not be found
- ZOJ1463
- jquery $('#btn').click与$("#btn").live("click",function()有什么区别？
- BZOJ 3038 上帝造题的七分钟2 （并查集+树状数组）
- js中定义用字符串拼接起来的变量名的变量
- HDU 4121
- Java并发包中CopyOnWrite容器相关类简介
- SQLServer 查看SQL语句的执行时间
- MYSQL:alter语句中change和modify的区别
- Android开发之漫漫长途 XIV——RecyclerView
- Spring（一）JdbcTemplate的环境搭建
- 基于vue 、vue-router 、firebase的todolist小项目
- JavaScript常用数组操作方法，包含ES6方法
- 【Vegas原创】VirtualBox扩容、分割的整体方案
- 仓储层接口IBaseRepository解析
- Java多态的向上转型和向下转型
- JDBC、ODBC、OLE DB、ADO、ADOMD区别与联系