DOMContentLoaded 时间过长

Mechnaic 2017-11-10 04:46:36

图片是放在阿里云 OSS 上的
一开始使用了压缩，网页在 3 - 4 秒就会打开
但是图片会莫名其妙的模糊
取消图片压缩后
网页访问速度慢了近 10 倍以上

...全文

1355 3 打赏收藏转发到动态举报

写回复

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

Mechnaic 2017-11-13

打赏
举报

回复

引用 1 楼 hongmei85 的回复:

向客服反映，看看是否线路问题

单独访问图片的话，访问速度很快，只有几毫秒时间

rukey2017 2017-11-10

打赏
举报

回复

试试谷歌的图片压缩

hongmei85 2017-11-10

打赏
举报

回复

向客服反映，看看是否线路问题

本文通过具体案例介绍如何使用Chrome DevTools分析DOMContentLoaded时间过长的问题，并提出拆包、调整资源引入顺序等优化策略。

博客主要探讨了DOMContentLoaded与异步脚本async、延迟脚本defer的关系，指出async不阻塞DOM解析，defer需执行完才触发DOMContentLoaded，二者都异步加载。还介绍了同步脚本会阻塞HTML解析，外链css并行下载不阻碍解析但阻碍渲染，现代浏览器有猜测预加载机制。

通过代码模块化、框架精简、代码打包压缩等手段，成功将地图加载时间从20多秒缩短至9秒左右。文章详细介绍了使用require.js实现代码按需加载、使用ant进行JS文件压缩合并以及tomcat中间件的配置优化。

DOMContentLoaded事件在文档结构解析完成后触发，不等待样式表、图片等资源加载，允许早期交互；而load事件在所有资源加载完毕后触发。这两个事件在性能优化中扮演重要角色，合适的使用可以提升用户体验。

本文介绍了DOMContentLoaded事件与load事件的区别，前者在DOM树构建完成后即触发，不等待其他资源加载；后者则需等到所有资源加载完毕才触发。通过示例展示了如何添加事件处理程序。

21,889

社区成员

140,337

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章