乐趣区

页面加载性能之文本内容

文本内容次要蕴含:HTML,CSS,JavaScript。

在 web 页面里,每个字符都是要从服务器获取的,本文档次要讲述如何晋升文本内容的加载速度。

拆散开发和线上环境

如果你为了减小资源大小采取了一些措施,而影响到可读性,肯定要记住当你间接批改线上代码的时候,之后可能无奈了解当初为什么这么改。

所以经常性,咱们会把开发和线上两个环境拆散,开发环境是可读性良好的代码,线上则是采取了优化措施之后的可读性差的代码。

放大代码体积

一个简略无效的办法就是移出多余的空格和不必要的字符,尽管咱们读起来会吃力,但浏览器能看懂就行。

HTML,CSS,JavaScript 都能够利用这种形式。

常见的工具

  • Minifier: 在线压缩 JavaScript 和 CSS,通过复制和黏贴的形式
  • HTML Minifier: 同上
  • Node module for Grunt
  • Node module for Gulp
  • Node module for HTML Minifier

压缩文本资源

罕用的是 gzip 的压缩,浏览器广泛支持,能够节俭近 70% 的体积。

即便是曾经压缩过的文件,gzip 也可能进一步压缩。常见的做法是,先用工具压缩代码,再由服务器提供 gzip 压缩。

缩小不必要的库依赖

为了应用某个性能,而引入一整个库,例如:想应用 jQuery 的 toggleClass,能够间接引入单个办法,而不必要引入整个 jQuery

总结

尽管一些大体积的资源,如图片,字体等是咱们最关怀的优化项,但也不能疏忽了文本内容,毕竟文本内容才是网页的主体。

参考

https://developers.google.com…

退出移动版