认识达内从这里开始

认真做教育专心促就业

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

发布：珠海达内
来源：互联网
时间：2021-01-19 09:26

响应式网页设计是目前的主流网页设计方式了，而今天我们就通过案例分析来了解一下，响应式网页设计优化方法都有哪些。

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

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、列表图片实现“懒”加载：

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

【免责声明】本文系本网编辑部分转载，转载目的在于传递更多信息，并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题，请在30日内与管理员联系，我们会予以更改或删除相关文章，以保证您的权益!更多内容请在707945861群中学习了解。

< 上一篇：性能测试指标与常用测试方法

下一篇：日志系统都有哪些特性 >