关于前端重构0

CSS置顶,JS置底。

静态资源外联、合并、压缩。

图片优化。(Png使用pngcrush;Gif使用gifsicle;Jpeg使用jpegtran)

图片延迟加载。(主要针对首屏外的图片。)

使用CSS Sprite,首屏图片全部合到一张图上。

静态文件上CDN。(静态文件的下载能提速20%左右。)

静态文件设置强缓存。(命中强缓存82.4%;命中若缓存3.4%;未命中缓存14.2%。)

HTML压缩。(Gzip后减少%5。)

页面的HTML标签中还有大量的内联CSS样式,有些页面的head部分也有CSS样式,需要把这些CSS放到独立的文件中;调整代码的层次缩进格式,不同层级按照4个空格来缩进;更改标准已不推荐的标签,如<center> <b>等,改为由CSS样式控制;统一命名规则,这里主要涉及HTML中的id和class名称;另外,在JavaScript中集中定义局部变量,并把部分全局变量转变为局部变量,缩小了变量的作用域。

原文地址:https://www.cnblogs.com/moli-/p/6476137.html