从前端角度来看高性能网站建设的几个原则

我有多年开发网站的经验。
验证，提供网站相应的速度一直是网站开发者孜孜不倦的追求。无论是后端程序的优化，数据库的优化，还是前端的优化，最终目的只有一个。
网站打开速度更快，为用户提供了更好的浏览体验。这里只是从前端人员的角度来说一些网站建设应该注意的原则。

1.减少网站的HTTP请求数量。

构造请求和等待响应需要时间，所以请求越少越好。
减少请求的一般思想是合并资源，减少显示一个页面所需的文件数量。常规方法有:

1.1图像映射

通过设置

1.2.CSS Sprite(CSS贴图集成/贴图拼接/贴图定位)

通过设置元素的背景位置样式来实现。一般用于界面图标。学术的标准工作
类型可以参考TinyMCE编辑器上面的小按钮。本质上是从一个统一的大图中通过不同的偏移量切割出很多小图，从而加载了界面上的很多按钮。
全世界只请求一次(请求大图一次)，从而减少HTTP请求的数量。

2，使用Gzip压缩，使用Gzip压缩HTTP消息，减少
音量，减少传输时间。3.将css样式表文件放在页面的前面。

首先加载样式表，以便页面呈现可以更早开始。
给用户一种页面加载更快的感觉，所以css最好放在

4.将Js脚本放在页面底部

和3的原因一样，先处理页面显示，先完成页面渲染，后执行脚本逻辑，给用户页面加载更快的感觉。

5.避免使用CSS表达式

过于复杂的JavaScript脚本逻辑、DOM搜索和选择操作会降低页面处理的效率。
6.使用JavaScript和CSS作为推广资源。这似乎违背了原则1中的合并思想，但事实并非如此:考虑一下，每个页面都引入了一个通用的JavaScript。
资源(如JavaScript库如jQuery或ExtJS)，单就一个页面的性能而言，内联(即在HTML中嵌入JavaScript)页面会比外部(使用
& lt脚本& gt标签介绍)页面加载更快(因为它的HTTP请求更少)。但是如果许多页面都引入了这个公共的JavaScript资源，那么内联方案
会造成重复传输(因为这个资源是嵌入在每个页面中的，所以每打开一个页面就会传输这部分资源，造成网络传输资源的浪费)。
这个问题可以通过隔离这类资源供外部参考来解决。

6.减少域名

每次申请新域名，都需要经过DNS。
找一个不同的域名，DNS缓存不起作用。因此，网站应尽可能在统一的域名下组织，避免使用过多的子域名，网站应保留一个主域名。

7.压缩您的JavaScript。

用JS压缩工具压缩你的JavaScript，非常有效。
。看看jQuery的两个不同发行版，你就知道区别了:

Jquery-1.6.2.js jQuery未压缩代码大小，230KB。

Jquery-1.6.2 .最小压力
缩减的jQuery代码大小:89.4KB

8.尽量避免http中的重定向。

重定向意味着当你真正访问你想看的内容时。
在页面前增加一轮额外的HTTP请求(客户端发起HTTP请求→HTTP server返回重定向响应→客户端发起请求新的URL →HTTP server返回内容，并加下划线。
行部分是额外的请求)，所以需要的时间比较多(给人的感觉是响应比较慢)。所以除非必要，否则不要使用重定向。如果你有以下要求，你可以
使用重定向。

8.1.避免URL无效

旧站点迁移后，为了避免旧URL失效，通常会将对旧URL的请求重定向到新系统的相应地址。

8.2.URL美化/伪静态

在可读URL和实际资源URL 9之间转换。删除重复的脚本。

不
在一个页面中重复介绍同一个脚本。例如，如果脚本B和C都依赖于A，那么在使用B和C的页面中可能会重复引用A。简单的解决方案
手动检查站点的依赖性，消除重复介绍；对于复杂的站点，需要建立自己的依赖管理/版本控制机制。

总结:做网站的时候把握好以上9条。
这个原理可以让我们的前端页面速度和响应速度更快。网站建设是一门比较精细的技术，想从事前端开发的网页设计师可以多了解一些基础知识。