2013 年前淘宝前端团队的研发模式基本以围绕前端框架的生态建设为主，各种小而美的工具百花齐放。但是随着团队规模日渐壮大，这种方式在整体效率提升、协同合作与风险管控上存在的非常大的问题，DEF 就是在这样一个背景下应运而生的！她不仅仅是一个工具、规范或代码组织方面的技术架构。工程是一件系统化的事情，DEF 工程体系平台从：编码指导规范、研发支撑工具、线上流程、权限管控、质量安全验收、数据日志报表等多个环节支撑起集团几百前端的日常研发工作，将规模化前端团队的研发效率提升到一个新的高度。

前端工程体系作为一种服务，由服务对象差异性引起的问题更多地集中于部署环节。SPA 不仅仅从开发角度实现了前后端分离，同样也解耦了前端和服务端资源的部署工作。不依赖 SSR 的 SPA 项目可以将 HTML 文件视为静态资源的一种，然而作为其他资源的唯一入口，HTML 文件不能使用强制缓存策略，所以从部署角度必须处理这种差异性。另外，SPA 可以离线使用的特点非常适用于 Hybrid 内嵌应用，然而如果想最大化的利用缓存不能只依赖于 Http 以及 Webview 本身的缓存策略，搜狗地图开发团队制定了一套基于本地模板包的部署和更新策略，本质理念借鉴 Http 协商缓存机制。本次分享主要讲解前端工程体系如何根据业务类型做出调整，以及搜狗地图团队针对 SPA 项目以及适用于 Hybrid 应用的部署和更新策略。

听众受益

1. 前端工程体系的服务本质以及如何根据业务类型做出调整；
2. SPA 项目的特殊性以及如何从部署角度制定适用于 SPA 的缓存策略；
3. Hybrid 与 SPA 相结合如何最大化利用 SPA 的优势；
4. 适用于 Hybrid 应用的模板部署和更新策略。

WebAssembly 技术自 2015 年出现之后便一直受到开发者们的关注。相较于 Chrome 早期推出的 PNaCI 等技术，WebAssembly 技术则更加开放和统一。WebAssembly 作为一种新的二进制格式，它可以方便地将 C/C++ 等其他静态语言代码快速的“运行”在浏览器中，这一特性为前端密集计算场景提供了无限的可能。不仅如此，基于 WebAssembly 技术，我们可以快速的将基于 Unity 游戏引擎开发的大型游戏快速的移植到 Web 端，这一切都要归功于 WebAssembly 技术带来的前端运算性能的大幅度提升。WebAssembly 技术现在已经被计划设计成为 W3C 的标准，众多浏览器厂商已经提供了对 MVP 版本的支持。Google IO 2017 大会上，谷歌也首次将 WebAssembly 技术进行公开演讲和推广。Post-MVP 版本更是会对 DOM 操作、多线程和 GC 等特性提供支持。WebAssembly 技术所带来的 Web 技术变革将势不可挡。

听众受益

1. 了解 WebAssembly 技术的核心原理；
2. 了解 WebAssembly 技术在现实业务中的应用；
3. 了解 WebAssembly 技术所带来的业务改进和提升（优势）；
4. 以及 WebAssembly 技术在未来的发展方向。

页面的打开速度是 Web 性能指标最重要的一项，以往我们通过一些常规手段（例如缓存、按需加载等）加快页面打开速度，而现在，随着一些新协议的提出，我们能做的更多了。HTTP2 和 QUIC 是两种新的 Web 开发协议，对之前 HTTP1.1 协议存在的一些问题做出了优化。QQ 空间前端团队通过对 HTTP2 和 QUIC 协议的应用和实践，使得 Web 页面访问速度得到了很大的提升，并且针对性地采用了不同的资源加载策略，最大化地利用协议的优势。本次分享将会给大家介绍这两种新协议的特性和实际应用。

听众受益

1. 了解 HTTP2、QUIC 协议的技术原理；
2. 适用于这两种新协议的前端优化；
3. QQ 空间应用实践的优化效果。