响应式网页设计优化方法都有哪些

necely
necely 这家伙很懒,还没有设置简介...

0 人点赞了该文章 · 34 浏览

  1、轻量级的Javascript库:

  针对PC端网页当然会选jQuery来作为前端javascript库,但是针对移动端来说,jQuery太重,而现在针对移动端来说,有很多优秀的框架可供使用,jQueryMobile、YUI、XUI等是不错的框架,但是个人比较倾向于zepto。不过zepto预定义的一些事件,比如触屏滑动的swipe事件,在ios上完美支持,但是在android上,有些浏览器确实不支持的,这时候就需要寻求与一些三方的javascript插件库,好在现在网上有很多优秀的三方javascript插件库可供使用,所以各位按需索取吧。

  2、减少HTTP请求次数:

  一个页面的初始加载使用HTTP请求来操作,没有任何问题,但是页面中比如翻页、筛选之类的操作,如果再使用完整的HTTP请求来处理的话,会加大网络传输的数据量,因为移动端有一个特殊的限制,就是用户的网络流量是有限的,超过之后会要交钱的。这时候针对这些页面内部的部分操作,可以使用Ajax异步请求来完成,针对短期内不会变化的一些数据,可以使用服务器端缓存、前端缓存等机制来保存这些数据,这样可以减少用户一定的数据请求量。

  3、压缩Javascript和CSS:

  把页面中使用的Javascript代码和CSS代码进行压缩之后会有效地减少页面大小。

  4、使用CDN来管理页面资源:

  CDN的全称是ContentDeliveryNetwork,即内容分发网络。其基本思想是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输的更快、更稳定。

  我们可以把一个页面上使用的外链的Javascript文件、CSS文件、固定的ICON图标和图片放在CDN上,这样在访问网页的时候可以使用户可就近取得这些资源,解决网络拥挤的状况,提高用户访问网页的响应速度。

  5、列表图片实现“懒”加载:

  移动终端设备因为屏幕大小有限,没有必要将全屏中的图片一次性加载进来,在网页加载的时候,我们可以选择只加载一个可视屏幕中的图片,当用户进行滑动页面的时候,再加载后续剩下的图片。

  由于时间关系,关于新媒体的相关内容我就介绍到这里。

发布于 2022-12-20 16:04

免责声明:

本文由 necely 原创或收集发布于 火鲤鱼 ,著作权归作者所有,如有侵权可联系本站删除。

火鲤鱼 © 2024 专注小微企业服务 冀ICP备09002609号-8