||
通过不断的实验研究,在现有技术背景下,通过优化以下两点,可以突破性的解决响应式网站普遍的性能延迟问题。
1、针对响应式的移动端和PC端运用懒加载技术,研究发现,正确使用css中的overflow:hidden属性可以使得在同一URL上,使用移动设备访问时,将不会加载使用了懒加载的PC资源,反之,在电脑端访问该URL时也不会加载使用了懒加载的移动端资源。这样可以很好的节省服务器带宽和浏览器渲染时的负担。从用户体验角度来讲,提升了网页的打开速度同时节省了上网流量。这将使响应式页面的性能问题得到根本解决。
如果使用属性display:none来替代overflow:hidden则不能达到上述效果。
2、JS代码升级,使用脚本异步加载或延迟执行,延迟执行可使JS在页面加载完成后再进行执行,异步加载可以使浏览器启动另一个进程加载和执行js,解决js阻塞渲染的问题,提升浏览器渲染网页的速度。
关于异步加载的方法可参阅我的博文《JS异步加载的几种方式总结》。
Archiver|手机版|科学网 ( 京ICP备07017567号-12 )
GMT+8, 2024-11-24 22:11
Powered by ScienceNet.cn
Copyright © 2007- 中国科学报社