W eb前端性能优化方案与实践

• 作者: 刘慧敏 曾梅琴 李少元 王成 缑锦 郑黎晓
• 来源期刊: 计算机应用与软件
• 学科: 工学
• 关键词: Web前端性能优化 服务器端优化 HTML优化 JavaScript优化 CSS优化 图片优化 前端测试环境 TimeLine UI Thread
• 年，卷（期）: 2014,（12）
• 所属期刊栏目: 应用技术与研究
• 页码范围: 89-95,147
• 页数: 8页
• 分类号: TP302.7
• 字数: 10058字
• 语种: 中文
• DOI: 10.3969/j.issn.1000-386x.2014.12.021

摘要

针对Web前端性能低下的问题，通过分析归纳Web中从后端到前端的B／S架构原理、浏览器缓存、浏览器的加载方式、服务器关于HTTP相关的配置等过程中一些影响前端性能优化的因素，系统地提出一个旨在提高网页加载速度、呈现速度和用户体验，整体性、通用性强的完整Web前端性能优化解决方案。该解决方案包括服务器端优化、HTML优化、JavaScript优化、CSS优化、图片优化等内容。并在HTTP代理工具Fiddler搭建的512 KB慢网速下通过SpeedTracer监测UI Thread，寻找基于HTML5技术的Web移动电子商务项目“指尖点餐系统”的点餐页面前端性能中的瓶颈，根据所提出的Web前端性能优化解决方案对其进行优化实践。优化前后的Timeline以及UI Thread对比分析表明，优化后加载时间降低了82％，页面渲染降低了32％，脚本执行减少了79％。

作者信息

序号	姓名	单位	发文数	被引次数	H指数	G指数
1	缑锦	华侨大学计算机科学与技术学院	27	191	8.0	13.0
2	王成	华侨大学计算机科学与技术学院	31	215	6.0	14.0
3	刘慧敏	华侨大学计算机科学与技术学院	3	68	2.0	3.0
4	郑黎晓	华侨大学计算机科学与技术学院	9	92	4.0	9.0
5	李少元	华侨大学计算机科学与技术学院	1	63	1.0	1.0
6	曾梅琴	华侨大学计算机科学与技术学院	1	63	1.0	1.0