这些优化技巧，可以让网页性能提升10倍

[liazei33]

首先可以用一个网站检测工具来诊断网页的打开速度和体积

站内优化

打开百度统计，在左侧菜单栏中的优化分析找到网站速度测试（本实战以社区为例）

https://tongji.baidu.com/

经过分析后找到建议优化的选项，根据建议修改

一般咱们优化的方案可以从一下几个方面入手

压缩网页资源体积

图片压缩

网站图片资源一般分为网站框架素材资源和网站内容素材资源。

框架资源可直接用图片压缩工具进行压缩，咱们选用在线压缩工具 https://tinypng.com/
进行压缩

对于网站资源类的素材，这个需要在上传的入口做好资源压缩，防止用户上传大文件，正确的做法是用户上传完图片后，服务器应当对图片进行压缩在存储

js、html、css 压缩

如果网页开发使用的是 webpack gulp 这一类的构建工具开发的话，打包后的网页自带压缩功能，但如果是常规页面开发，则需要借助一些工具来压缩线上的网站代码，这里推荐使用 parceljs 这个打包工具来压缩代码
打包教程链接：https://xnit.funtask.club/topic/55

减少DOM结构

尽量减少DOM结构的深度，和元素的数量，这样可以让浏览器渲染更快，体验更佳

去掉不必要的资源引入

很多时候为了开发方便，我们可能会在一个页面中引入很多js 和 css，其中有一部分js 和 css在页面里面是没有任何作用的，这一部分脚本和样式文件可以直接删除

站外优化

加大服务器的带宽

服务器带宽也是影响网站打开速度的主要原因之一，一般网站带宽建议在5M以上

加入CDN

除了加大网站带宽外，CDN也是一个很好的选择，使用CDN的好处是可以扛住大量并发请求，保证网站的稳定访问，这里不做原理讲解，如需了解可在百度搜索CDN相关的信息