王军礼分享 http://blog.sciencenet.cn/u/wangjunliblog 王军礼的科学网博客

博文

响应式网站突破式性能提升优化方法

已有 2860 次阅读 2018-10-26 15:25 |个人分类:IT技术|系统分类:科普集锦

通过不断的实验研究,在现有技术背景下,通过优化以下两点,可以突破性的解决响应式网站普遍的性能延迟问题。

1、针对响应式的移动端和PC端运用懒加载技术,研究发现,正确使用css中的overflow:hidden属性可以使得在同一URL上,使用移动设备访问时,将不会加载使用了懒加载的PC资源,反之,在电脑端访问该URL时也不会加载使用了懒加载的移动端资源。这样可以很好的节省服务器带宽和浏览器渲染时的负担。从用户体验角度来讲,提升了网页的打开速度同时节省了上网流量。这将使响应式页面的性能问题得到根本解决。
如果使用属性display:none来替代overflow:hidden则不能达到上述效果。

2、JS代码升级,使用脚本异步加载或延迟执行,延迟执行可使JS在页面加载完成后再进行执行,异步加载可以使浏览器启动另一个进程加载和执行js,解决js阻塞渲染的问题,提升浏览器渲染网页的速度。
关于异步加载的方法可参阅我的博文《JS异步加载的几种方式总结》。



https://wap.sciencenet.cn/blog-1273577-1142933.html

上一篇:IE浏览器版本过低时提示升级只需一行代码
下一篇:微科普获得“全国安全可信网站”称号
收藏 IP: 221.217.48.*| 热度|

1 孙杨

该博文允许注册用户评论 请点击登录 评论 (0 个评论)

数据加载中...

Archiver|手机版|科学网 ( 京ICP备07017567号-12 )

GMT+8, 2024-4-19 07:58

Powered by ScienceNet.cn

Copyright © 2007- 中国科学报社

返回顶部