- 压缩源码和图片
JavaScript 文件源代码可以采用混淆压缩的方式,CSS 文件源代码进行普通压缩,JPG 图片可以根据具体质量来压缩为 50% 到 70%,PNG 可以使用一些开源压缩软件来压缩,比如 24 色变成 8 色、去掉一些 PNG 格式信息等。
- 选择合适的图片格式
如果图片颜色数较多就使用 JPG 格式,如果图片颜色数较少就使用 PNG 格式,如果能够通过服务器端判断浏览器支持 WebP,那么就使用 WebP 格式和 SVG 格式。
- 合并静态资源
包括 CSS、JavaScript 和小图片,减少 HTTP 请求。
- 开启服务器端的 Gzip 压缩
这对文本资源非常有效,对图片资源则没那么大的压缩比率。
- 使用 CDN
或者一些公开库使用第三方提供的静态资源地址(比如 jQuery、normalize.css)。一方面增加并发下载量,另一方面能够和其他网站共享缓存。
- 延长静态资源缓存时间
这样,频繁访问网站的访客就能够更快地访问。不过,这里要通过修改文件名的方式,确保在资源更新的时候,用户会拉取到最新的内容。
- 把 CSS 放在页面头部,把 JavaScript 放在页面底部
这样就不会阻塞页面渲染,让页面出现长时间的空白。
每一个条目都可以进一步深层挖掘下去。
Web 性能优化分为服务器端和浏览器端两个方面。
相关推荐
web性能优化(服务器优化).pdf
前端学习笔记整理:HTML, CSS, JavaScript, Web 性能优化, 工具, 框架, 资源 前端学习笔记整理:HTML, CSS, JavaScript, Web 性能优化, 工具, 框架, 资源 前端学习笔记整理:HTML, CSS, JavaScript, Web 性能优化, ...
web性能优化最佳实践
web性能优化(服务器优化).doc
WEB性能优化实践分析,优化方法的实践,web优化黄金规则
web性能优化演示文档
web性能优化思维导图
大规模Web性能优化调研报告.doc
单页面Web性能优化实践.pptx
介绍大的网站优化WEB性能的几种常见及实用的方法
lotus domino 性能优化及考虑
软件开发与项目管理-1期 KC02_模块四_模块案例_Web性能优化实例.doc 学习资料 复习资料 教学资源
Web应用性能提升之C#代码优化Web应用性能提升之C#代码优化
高性能网站建设进阶指南:WEB开发者性能优化最佳PDF,不可用于商业用途,如有版权问题,请联系删除!
讲解: 服务器动态压缩、合并静态文件 图片懒加载 BigPipe
Web 前端性能优化思路与学习方法Web 前端性能优化思路与学习方法Web 前端性能优化思路与学习方法
Web前端性能优化全攻略
让你页面速度飞起来,Web前端性能优化。 让你页面速度飞起来,Web前端性能优化。百度云盘视频资料,下载直接看