中国“出海”教育行业如何优化Web性能？

李岳霖

Web性能既是教育企业“出海”的“起跳台”，也可能是扭转命运的“转运石”，构筑稳固的“起跳台”，珍视“转运石”隐藏的机遇，教育行业“出海”就更能聚焦核心业务而无网络体验的后顾之忧。

据统计，从2015年开始，中国就一直是全球教育科技投资较为活跃的地区，并且一直延续至今。2020年，由于新冠肺炎疫情的发生，技术加速融入到教育产业中，越来越多的教育公司开始不再仅仅将目光放在本土市场，而是开始放眼全球。

一方面，作为亚洲最大的国际留学生目的地，中国本该迎接数十万名国际留学生的到来。但受海外疫情影响，大部分留学生仍无法入境就学，转为线上学习。

另一方面，多款中国“出海”教育类应用在疫情期间的下载量大幅增加，用户需求持续攀升，造成了“流量洪峰”。这种背景下，作为承载师生用户的流量端口，“走出去”的中国教育行业网站和应用程序正面临着新的机遇与挑战。

一项研究表明，国际学生更可能通过浏览学校官网来决定是否申请到该学校学习，而高达的50%注册国际学生甚至仅通过浏览学校官网就决定注册，因此Web体验对于想要“走出去”的学校至关重要。

此外，教育类应用程序也对Web性能有着更高要求。以国内某“出海”教育应用程序为例，为了给教师和学生提供更好的用户体验，该应用程序开发商承诺，若授课过程中出现多次卡顿等网络问题，教师可以选择结束课程，而平台不仅会正常支付教师课时费用，还要向学生赔偿相应的学时。由此可见，正在“走出去”的中国教育企业将Web性能与体验当做了“起跳台”。与此同时，我国教育企业也承担了很大的风险，Web性能将直接影响生源和业绩，进而决定教育机构或企业的发展。

然而，Web性能的提升是非常复杂的工程，它涉及用户访问体验的可见性、对海外互联网状况的了解、跨部门跨技术栈、性能的优化经验等多方面考量。因此，为了优化网站和应用程序的整体访问效果、保障遍布全球各地的老师和学生的用户体验，“走出去”的教育机构和教育类应用程序进行Web性能优化时需关注以下几个方面。

走好第一步：全面了解站点基本情况

所谓“知人者智，自知者明，胜人者有力，自胜者强”。对于“走出去”的教育机构和教育类应用程序来说，全面了解自身站点的情况是Web性能优化“旗开得胜”的关键。

总体而言，相关负责人需要利用Ping、模拟测试工具以及真实用户监测工具（RUM）对自身站点情况进行全面监测，以此详细了解其用户的分布情况、访问来源、终端特征、页面构成以及关键路径等重要信息。

具体来讲，想要全面了解站点的基本情况，需要掌握以下内容：在用户分布情况方面，主要包括用户分布的国家或地区、具体的分布比例;访问来源分析旨在了解用户桌面端或手机端、浏览器或应用程序等终端特征;在页面构成方面，需要分析整体页面的图片数量、尺寸、格式以及视频展示的大小、时间等构成状况;在关键路径方面，教育機构和教育类应用程序需明确关键路径中的HTML文件或CSS文件等关键资源，并将其进行预加载与优化，从而保障整体访问效果。

优化页面加载：“优先+压缩”两步走

在对网站和应用程序有了全面了解后，“走出去”的教育机构和教育类应用程序可以着手进行整个网站的加载优化。在整个网页加载的优化过程中，相关负责人应对关键文件进行预加载和优化，即优先加载HTML文件、CSS文件、JS文件，然后再加载图片、文字、视频等页面展示文件，以此达到减少页面响应时间的效果。另外，对于某些非必要加载的JS文件，延迟加载或异步处理的方式将让教师和学生获得更好的页面感受及体验。

除了对上述文件的优化，“走出去”的教育机构和教育类应用程序还需对每个字节进行更深入的优化。由于压缩通常能将响应的数据量减少70%，因此压缩便是另一提升Web性能的加速方法。

除业界通用的GZIP压缩方式，教育机构和教育类应用程序还可采用如Brotli这类更先进、更加灵活的压缩方式。Brotli的压缩算法可将CSS和JS文件的比例压缩至15%～30%，由此减少网页加载内容和降低页面大小，最终达到页面加载性能和速度的提升，保障教师和学生的站点访问效果。

优化图片和视频加载：对症下“图”

对于在线教育行业而言，视觉化的表达可以更好地展现教学内容、提升师生线上留存时间，因此丰富有趣的图片和视频是教育机构和教育类应用程序和网站必不可少的页面元素。但由于视频和图片通常占据较大的加载数据量，加载时间比其他文件更长。

为了优化图片和视频的加载速度，教育机构和教育类应用程序和网站需要选择匹配终端用户浏览器的最佳图片格式。通常而言，图片格式的压缩转化可节省30%以上的字节。因此，在保证图片质量和效果的前提下，网站和应用程序需寻找合适的压缩比例，使页面的响应速度得到大幅提升。

此外，Akamai观察发现，针对桌面端和移动端设备，教育机构和教育类应用程序和网站普遍存在页面均加载同一版本图片的问题，这种做法会造成移动端用户的页面数据加载冗余。因此，教育机构和教育类应用程序和网站还应基于教师和学生终端设备的种类来选择不同尺寸的图片，避免过多的数据加载，减少整体页面加载的数据量。

优化协议版本：紧跟前沿、重视安全

Akamai发现，当前大多数“出海”教育网站采用的协议版本为HTTP1.1，而非更新的HTTP2.0协议。事实上，HTTP2.0对网站加载有颇多益处，例如它可以压缩HTTP头部字段进行资源加载的多路复用和并行加载、进行关键资源的服务器推送，以及在加载完HTML文件后可预先将文件推送到浏览器本地加快内容渲染。因此，“出海”教育网站应使用更新的HTTP2.0协议来加速其页面加载效率和网站访问质量。

另一方面，在全球个人隐私和数据保护备受重视的当下，除了教育网站和应用程序的页面加载效率，后台数据和师生隐私信息的保护也至关重要。

然而，我国多数教育机构网站和应用程序在国内采用无加密的HTTP协议，尚未使用加密性更具优势的HTTPS协议。

当这些网站和应用程序“出海”时，就会出现低版本或过时协议的使用问题。这些问题致使数据在传输过程中被窃取和改变的风险增大，因此，“走出去”的教育网站和应用程序应使用最新版本协议，避免因信息安全泄露产生经济和法律问题。

优化第三方资源和静态缓存

随着“走出去”的教育网站结构变得愈加复杂，其所需的功能也与日俱增。网站正在引入更多的第三方资源，甚至第四方、第五方和第六方资源。可怕的是，当其中某一资源的加载出现问题时，网站的整个页面就会遇到性能瓶颈。虽然教育网站无法过度干预第三方资源的加载，但仍可通过优化、替代或者整体延迟加载进行处理。

此外，为了提升页面显示效率，支持并发获取资源，“走出去”的教育机构还应将其网站中的图片、JS、CSS、视频、HTML等静态文件进行有效缓存，利用CDN将静态资源缓存在距离用户最近的位置，确保教师和学生从最近的地方获取相应的静态资源，优化文件传输的互联网路径。对于大多数教育行业的网页来说，静态数据占据了超过一半的内容。Akamai发现，如果没有缓存，那么用户可能会花费几秒的时间来提取和传输这类数据，但采用缓存后不到1秒便可完成。

疫情之下，中国“出海”教育行业开辟了新的教学模式，线上、线下混合教学模式正在成为常态。

为了吸引更多海外师生用户，并为现有师生提供优质的体验，“出海”教育行业必须持续对其网站和应用程序进行优化，形成“监控—优化—验证”的完整闭环，打造全球化的教育网络，让教育突破空间的限制。从这个角度上看，Web性能既是教育行业“出海”的“起跳台”，也可能是扭转命运的“转运石”，构筑稳固的“起跳台”，珍视“转运石”隐藏的机遇，教育行业“出海”就更能聚焦核心业务而无用户网络体验差的后顾之忧。