发布日期：2020.10.10

Web 性能为何那么重要？

无论访问任何网站，每个人肯定都希望速度越快越好。“不等待”和“秒开”，已经成为大家对任何网站的心理预期。

对商家，尤其是通过网站面向全球客户开展业务的电商来说，这一点更加重要。如果无法保证网站访问速度，不仅客户会流失，自己的搜索排名会大幅下降，甚至有时候还会导致企业形象受损……

更麻烦的是，Web 性能的提升是个复杂工程。首先，随着业务出海，必须了解不同国家和地区的互联网基础设施状况，例如移动网络的普及率、宽带性能、用户偏好、运营商分布等；其次，需要明确了解用户访问过程中遇到了与体验有关的哪些问题，并确定从何着手解决；最后，为了顺利解决这些问题，往往需要进行跨部门、跨技术栈的合作，可能会涉及到企业内部运维、开发、涉及、业务、信息安全等不同职能的人员。

在此基础上，才能通过各种专用的模拟测试工具或真实用户监控工具（RUM）衡量用户 Web 体验，进而围绕监控、优化和验证这三个缓解不断迭代，持续优化Web 性能。

专家建议，为你的 Web 优化支招

>>>>了解你的网站

首先，我们必须对网站和访客的相关情况获得足够全面的了解。用户主要分布在哪里？遍布全球还是某个特定地区？用户主要使用哪类设备访问你的网站？你的网站所有资源中各类文件占比如何？哪些资源又是网站顺利渲染必不可少的？

只有在了解这些内容后，才能根据实际情况进一步采取措施进行优化。

>>>>尽可能压缩资源文件

对于网站加载所涉及到的资源文件，例如 JS 脚本和 CSS 文件，以及各类图片和视频，通过压缩往往能进一步减小体积并提高加载速度，并保证最终渲染的页面符合我们的预期。

例如对于 JS 脚本和 CSS 文件，可通过 Brotli 进行压缩，该方式通常可在保证文件内容不受影响的情况下将此类文件的体积缩减50%以上！当然，对于那些不是很重要的 JS 文件，还可以采取异步或推迟加载的措施，借此进一步缩短页面载入和渲染时间。

对于图片和视频等多媒体内容，则可根据访客的浏览器和终端屏幕尺寸进行智能判断，并结合实际情况给每个访客提供理想格式的内容，借此在减少网页加载产生的数据量同时，保证访客的视觉效果不受影响。

>>>>缓存的处理

缓存的使用可有效降低服务器负担并改善 Web 性能，因而在条件允许的情况下，我们需要尽可能缓存一切能缓存的资源，并尽可能增长缓存时间。但与此同时，对于一些更新频繁的文件，则建议对文件添加版本号，以避免因为缓存刷新不及时导致渲染的 Web 内容出现错误。

>>>>全面监控

在采取各项措施优化 Web 性能的同时，也别忘了对网站进行全面的监控。例如我们可以使用 WebPageTest、Chrome 开发者工具、SSL labs、mPulse、Request Map 等工具了解网站在任何时段内的性能表现情况。这不仅可以帮助我们尽早发现可能存在的应能问题并加以应对，也可用于对已经采取的各类优化措施的效果进行进一步的衡量和评估，并以此为基础对性能进行不断的优化和监控。

五个重要结论

总的来说，我们可以通过下列五项措施进一步优化 Web 性能：

▶ 借助 CDN 覆盖访问用户的国家/地区

▶ 优化关键渲染路径，提升用户性能感知

▶ 精简/异步/延迟加载非关键 JS，避免“白屏”

▶ 加速用户与页面的交互

▶ 常用的性能监控和页面分析工具