网站设计制作中如何提高网站的访问速度？专业知识介绍

2022-05-21 分类：网站设计

（1）减少HTTP请求数量。

80%的用户响应时间被花费在下载页面中的图片、样式表、脚本以及Flash这些组件。减少这些组件的数量就可以减少展示页面所需的请求数，而这是提高网页响应速度的关键。

（2）使用内容分布式网络。

用户连接网站服务器的速度影响响应的快慢。把你的网站布置在多台分布于不同地域的服务器上，会让用户觉得你的页面加载速度更快。

（3）给头部添加一个失效期或者Cache-Control。

给头部添加far future失效期，可以增加浏览器缓存的组件数量并重复用于随后的页面浏览而不需要通过用户的网络发送哪怕一个字节。

（4）Gzip压缩组件。

压缩文件会减少HTTP响应的大小从而减少响应的时间。
（5）把样式表放在前面。

把样式表挪到文档的头部可以让页面的加载显得更快。因为把样式表放在头部可以让页面逐步呈现。

（6）把脚本放在最后。

脚本可能会堵塞并发的下载。通常的建议是使用延迟脚本。如果一个脚本可以被延迟，那么它也可以被放在页面的底部。这会让你的页面加载得更快。

（7）不使用CSS表达式。

CSS表达式的问题是它比大多数人期望的执行次数更频繁。

（8）使用外部的JavaScript和CSS.

在实际应用中使用外部的文件往往产生更快的页面，因为浏览器会缓存JavaScript和CSS文件。

（9）减少DNS的查询。

减少不同域名的数量可能减少页面并行的下载数量。
（10）缩小JavaScript和CSS。

缩小是指从代码中删除不必要的字母，减少文件体积从而提高加载速度。

（11）避免重定向。

重定向降低了用户体验。在用户和HTML文档之间插入的重定向延误了页面的呈现和组件下载，因为它们都不可能在获得HTML文档之前开始。

（12）移除重复的脚本。

在同一个页面中包含两个相同的脚本文件降低了性能。当脚本被重复包含时，由于增加了不必要的HTTP请求和JavaScript的执行，影响了性能。

（13）设定ETags。

ETag的问题是它们往往在网站的一个服务器中被设为唯一的，当浏览器从一个服务器得到了组件并在稍后试图到另一个服务器验证时，ETag会不匹配，而这在使用多个服务器来处理请求的网站中是很常见的。

（14）让Ajax可以缓存。

Ajax的好处之一是它能给用户提供瞬间的响应，因为它从服务端异步请求数据。为了提高性能，优化Ajax响应很重要。提高Ajax性能最重要的方式是使响应缓存。

（15）更早地刷新缓冲区。

当用户请求一个页面，服务端会花费200至500毫秒的时间组合HTML页面。

（16）在Ajax请求中使用GET方法。

（17）后加载组件。

当你确保页面工作正常时，通过延后加载的那些更花哨的脚本比如拖放和动画，可以来增强你的页面。

（18）预先加载组件。

预先加载组件让你可以利用浏览器的空闲时间来加载之后需要的组件（比如图片，样式表和脚本)。这样当用户浏览下一个页面的时候，大部分组件都已经在缓存里了而页面会加载得更快。

（19）减小DOM元素的数量。

复杂的页面意味着更多的字节需要被下载。你在页面中添加一个事件，让它在500或者5000个DOM元素中循环，它们的效率是不同的。

（20）分域部署部件。

将部件分割能使你获得大的并行下载效率。但你同时需要注意不使用多于2~4个域名，以避免DNS查询导致的问题。

（21）减少lframe的数量。

lframes能够使HTML文档被插入进父级文档中。
（22）避免404错误。

一个获得没用的404响应的HTTP请求对于宝贵的HTTP请求资源来说是完全不必要的，而且这样还会减慢用户的体验。

（23）减少Cookie的大小。

有多种理由让我们应用HTTP Cookie，比如身份验证，或者个性化设置。Cookie中的信息在服务端和浏览器间被放在HTTP头中交换。尽量减少Cookie的体积对减少用户获得响应的时间十分重要。

（24）为部件使用没有Cookie的域名。

当浏览器请求一个静态图片并一同发送Cookie时，服务器并不需要这些Cookie。这样只是毫无益处地创建了多余的网络流量。应当保证静态的部件在请求时没有携带Cookie，所以需要把你的静态部件放在另一个子域名下。

（25）减少DOM的读取。

利用Javascript读取DOM元素很慢，所以为了获得响应更快的页面，你应该:·缓存被读取的元素引用。

●脱机更新节点，然后把它们加回到树结构中。·避免利用Javascript定位布局。

（26）开发灵巧的事件处理程序。

如果有太多的事件处理逻辑部署在DOM树的不同元素上，它们的频繁执行会拖慢页面的响应速度。

（27）选择而不是@。

前面提到把CSS应当放在最顶端来提供预显。在lIE中，放在页面底部的@import和效果是一样的，所以最好不要用它。

（28）不使用过滤器。

IE专有的AlphalmageLoader过滤器是为了解决半透明真色PNG图片在IE7之前的版本中显示的问题。这个过滤器会在图片下载时堵塞住展示。而且它会消耗内存并影响每个元素而不仅仅是每张图片，所以这个过滤器的问题很多。

（29）优化图片。

（30）优化CSS精灵。

横向布局Sprite中的图片往往比纵向布局会减少文件大小。

（31）不要在HTML中缩放图片。

不要使用大小超过需要的图片，即使你能够在HTML中设置它的属性。

（32）使用小的可缓存的Favicon.ico。

Favicon.icon是放在服务器根目录的一个图片，它麻烦却不得不处理，因为即使你不关心，浏览器依然会请求这张图片，所以最好不要提供一个404的错误。而且由于它是在同一服务器下的，Cookie也会随着每次请求一并发送。这张图片同样干扰下载队列，比如在IE中，当你在onload事件中请求额外的组件时，Favicon会在这些额外组件之前下载。

（33）保证组件大小小于25K。

（34）把组件打包进多部分文档中。

名称栏目：网站设计制作中如何提高网站的访问速度？专业知识介绍
文章链接：/news/155651.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有网站设计等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容