2023前端技术及开源发展研究报告

前端技术及开源发展 研究报告 云计算开源产业联盟 2023年5月 编制说明 本报告由云计算开源产业联盟撰写，限于撰写组时间、知识局限等因素，内容恐有疏漏，烦请各位读者不吝指正。 在编写过程中得到多家单位的大力支持，在此特别致谢中国信息通信研究院、华为技术有限公司、北京京东世纪贸易有限公司、深圳市腾讯计算机系统有限公司、上海浦东发展银行股份有限公司、建信金融科技有限责任公司、中原银行股份有限公司、苏州棱镜七彩信息科技有限公司、浪潮云信息技术股份公司、中兴通讯股份有限公司、中国农业银行软件研发中心、东软集团股份有限公司、深圳开源互联网安全技术有限公司、中国工商银行股份有限公司、北京小桔科技有限公司、中国联合网络通信有限公司软件研究院等单位的各位专家，感谢各位秉承开源精神，协同共创，从多个视角提出了对于前端技术的理解，最终完成本报告的撰写工作。 本报告核心编写者：张燕、俊哲、张毅、李一昂、王泽增、贾武林、林琳、焦颖。 本报告贡献者：吴海鑫、马剑、苏昊欣、胡雄伟、黄立、黄小然、谢钊、吴鑫、孙超、孙亚楠，丁涛、陈旭、丁涛、马琳琳、高杨、徐志亮、赵群、李鑫、梁锐、孟繁贵、李迎辉、牟宁波、李佩芳、杨鸣，赵赫、陈莲、王颉、贺文轩、易焕腾、谢家兴、王媛媛。 前言 前端即网站或应用程序的用户界面部分，作为视觉和功能连接的核心，其通过程序语言整合文字、图片、视频等内容信息，呈现给用户，从而与用户建立沟通渠道。 前端技术也即用于构建网站和应用程序用户界面的各种技术。在前端技术的发展轨迹中，开源贯穿始终，逐渐成为推动前端技术全面升级的中坚力量。随着数字化转型的不断深入，市场需求日益丰富，终端种类和数量高速增长，前端正在通过持续的技术革新和融合不断突破自身边界，进而重新定义自身价值。无论是前端低代码平台建设，还是前端智能化落地，抑或是微前端体系构建，都已成为前端技术发展的重点方向。 在这种大变革的时代背景下，云计算开源产业联盟联合产业界共同发布前端技术及开源发展研究报告，聚焦前端技术领域不断涌现的新技术、新模式，分析总结全球和我国发展的总体态势，并重点针对我国前端开源技术的创新趋势和应用状况进行探讨，最后对我国前端技术的未来发展方向进行展望与研判。希望本报告为社会各界深入了解前端开源技术提供有价值的参考。 目录 一、前端发展总体态势1 （一）开源持续推动前端技术快速迭代，赋能产业全面升级1 （二）软件供应链趋于复杂化和多样化，前端开源风险不断加剧2 二、前端技术创新趋势4 （一）开源语言和工具基础设施为前端技术发展奠定坚实基础4 1.开源语言TypeScript成为新一代前端标准4 2.Rust工具融入前端生态，成为JS基础设施的未来5 3.开源工具基础设施推动前端向前发展7 （二）前端技术应用领域不断拓展8 1.前端开源框架深耕全栈领域8 2.WebRTC在音视频技术中独放异彩9 （三）新技术驱动业界开始研发模式变革10 1.低代码支撑大前端工程体系构建10 2.前端智能化方兴未艾12 3.微前端极大提升前端生产力13 4.前端“边缘渲染”成为大势所趋14 三、我国前端技术发展现状调研15 （一）三大主流开源框架稳居前列，黑马开源框架Svelte异军突起16 （二）开源前端库Axios成为“事实标准”，AntDesign取得广泛应用17 （三）TS采用率稳健增长19 （四）微前端成为不可轻视的一环20 （五）前端技术未来发展趋势调研20 四、我国前端技术发展机遇22 五、附录23 （一）前端开源技术评价方法23 一、前端发展总体态势 （一）开源持续推动前端技术快速迭代，赋能产业全面升级 开源推动前端技术持续迭代。互联网发展早期，万维网（WWW）、浏览器、开源语言JavaScript（以下简称“JS”）相继诞生，前端界面以纯静态的文本和图片为主，前端开发工作低级单一。Ajax的诞生助力前端技术成功迈向2.0时代，动态网页逐渐成为主流。与此同时，jQuery的诞生，推动了开发者注重前后端分离。jQuery的流行降低了前端门槛，使得前端工程师的队伍越来越壮大。而jQuery的广泛应用所带来的白屏和全局污染问题又进一步加速了前端模块化阶段的到来。2009年开源技术Node.js诞生，并催生了前端工程化。Svelte、React、Vue、Angular等开源框架的流行驱动了前端产业高速发展。 前端开源赋能产业全面升级。在开源技术的持续加持下，前端早已跳脱出页面展示的技术局限和功能分工，在跨平台融合技术、音视频技术以及前端整体工程效率提升技术等领域都占有一席之地。在跨平台融合技术上，ReactNative、WEEX、Flutter、Kraken等一系列优秀的开源技术解决方案的出现，成功实现了逻辑跨端和渲染跨端，保障了异构终端研发的一致性，从而使得Web端、移动端、及各类IoT设备的统一前端展现成为可能。在音视频技术上，随着直播带货、在线会议、在线教育等远程实时场景的兴起，音视频技术也得到广泛关注和使用，其中WebRTC、WebAssembly等开源技术可帮助用户在使用音视频时获得更加理想的用户体验。随着WebRTC在云和端上技 术体系的成熟，视频工程开发领域的门槛也将大幅度降低。在持续的技术革新和技术融合中，前端不断自我突破、自我演进，推进产业高速发展和全面升级。在工程效率上，前端DevOps技术生态正持续完善，新的工具链及方法论的引入显著提升了工程研发及运维效率。低代码和无代码领域的发展仍在升温，作为一种全新的开发范式，低代码方案基于可视化和模型驱动的理念，可大幅降低业务交付成本，各家企业正在积极布局该领域，促进技术和业务深度合作。目前，国内各大互联网厂商已经开始布局低代码开源社区，积极引导低代码生态建设。 （二）软件供应链趋于复杂化和多样化，前端开源风险不断加剧 软件供应关系日趋复杂多元，供应网络安全风险不断升级。伴随着产业发展，软件开发的规模化协作模式已逐渐取代单体模式，软件各组件间连接日益紧密，从而共同形成一个包含众多节点的供应关系网络，即软件供应链。规模化协作模式盛行之下，开源模式的优势日益彰显。而引入开源软件，便为软件供应链路再度引入开源软件的上游社区、基金会、开发者、维护者以及源码包、二进制包、包管理器和存储仓库等诸多节点，因此软件供应链复杂度全面升级、多样性显著增强。另一方面，开源供应链产品更新迭代速度快、软件模块数量多、生产线上化、供应全球化、仓储集中化、用户多样化等特点1，也加剧了软件供应链的安全风险。 1https://www.cas.cn/cm/202011/t20201119_4767459.shtml 前端开源风险加剧，开源使用问题凸显。由于前端开源技术往往迭代更新迅速，同时缺乏相应安全机制，因此前端开源风险也随着开源在前端领域的持续渗透而有不断加剧之势。常见的开源前端软件风险主要包括三大方面。一是安全风险，包括开源软件本身安全漏洞所导致的风险，以及因依赖开源软件而产生的安全漏洞风险。前端开源软件具有漏洞数量多、漏洞影响范围大的特点。根据新思科技发布的 《2023开源安全和风险分析报告》2，审计代码库发现的排名前十的大漏洞中与前端相关的漏洞高达7个。其中排名前三的漏洞组件分别是jQuery（47%的被审计代码库中包含）、Lodash（31%的被审计代码库中包含）、Bootstrap（23%的被审计代码库中包含），前端项目依赖的复杂性也增加了引入漏洞的风险。根据Snyk与Linux基金会联合发布的《2022年开源安全报告》3，JavaScript项目的平均依赖数为174个，是所有技术生态中最高的（Java项目平均40个依赖）。二是供应链风险，前端开源供应链风险大有加剧之势。前端npm由于管控薄弱、攻击成本低而成为软件供应链攻击的重灾区，近年来已出现多起严重的前端开源供应链投毒事件。2022年3月，开源组件node-ipc作者出于个人政治立场在代码中进行npm供应链投毒，作者通过添加恶意JS文件在用户桌面创建标语，甚至还曾计划删除特定区域用户的本地磁盘文件，vue-cli、unity-hub等工具都因此受到了不同程度影响。三是合规风险，包括开源许可协议、版权和出口管制等方面的合 2Synopsys2022开源安全与风险分析报告https://www.synopsys.com/zh-cn/software-integrity/resources/analyst-reports/open-source-security-risk-analysis.html 3StateofOpenSourceSecurity2022https://snyk.io/reports/open-source-security/ 规风险。虽然大部分前端开源项目会采用比较宽松的MIT、ApacheLicense等许可协议，但由于前端依赖的复杂性，需要特别注意依赖软件引入的许可协议和版权合规风险。例如React-Native本身采用MIT协议，但其中部分代码却采用了CreativeCommonsAttributionShareAlike3.0进行授权许可，从而导致了潜在的许可证冲突。此外，前端开源软件的许可证种类也可能发生变更。例如React曾经在开源许可协议BSD的基础上添加附加专利条款，要求使用React者不可做任何与Facebook构成竞争的事情。然而，由于社区的强烈反对以及Apache基金会强制要求禁用，Facebook又将许可证更新为了MIT协议。 二、前端技术创新趋势 （一）开源语言和工具基础设施为前端技术发展奠定坚实基础 1.开源语言TypeScript成为新一代前端标准 TypeScript直击JS痛点。JS作为前端技术的核心语言奠定了前端技术的发展基础，但当业务应用的代码量过大或逻辑过于复杂时，动态化极高的JS代码的维护成本和难度便会迅速爬升，甚至到达一个不可能维护的程度。而TypeScript（下文简称“TS”）凭借其强大的类型系统以及完善的OOP（面向对象编程）实现，在大型、复杂业务应用的开发中更具优越性。 TS成新一代前端行业标准。由于当前几乎所有浏览器内核都将 JS作为其唯一的默认内置脚本语言，而TS是基于JS的一个超集， 故在前端开发中使用TS无需转化编译，此外，对于JS程序员而言，TS的使用门槛也极低，无需进行系统学习便可应用于实际开发，故TS颇受前端开发人员的青睐。据软件开发与设计公司TheSoftwareHouse2022年就前端市场状态所进行的市场调查，TS使用人数的年增长率超7%，目前已达84%，并且约43%的受访者认为TS将超越JS成为前端开发的主要解决方案。4另外，GitHub2022年调查报告显示，自2014年以来，TS在主流编程语言的排名中稳步提升，当前已跃居第四。5 20142015201620172018201920202021 0 1 2 3 4 5 6 7 8 9 10 11 JavaScriptPythonJavaTypeScript C#PHPC++Shell CRuby 图1GitHub近七年开发语言排名变化 来源：GitHub，2022年3月 2.Rust工具融入前端生态，成为JS基础设施的未来 Rust逐步融入前端生态，或成JS工具化未来。在对基础设施性能要求极高的前端领域，核心语言JS却在该点上一直饱受诟病。而开源项目Rust自诞生以来，便以优于其他脚本语言的高可靠性和高性能吸引了大批前端开发者。自2009年Rust开源以来，社区历经十 4https://tsh.io/state-of-frontend/#report 5https://segmentfault.com/a/1190000040980449 余年的发展，目前Rust开源社区已有超过6000名贡献者6，和1300万开发者7。另根据StackOverflow2021年开发者调查，Rust已连续六年成为最受开发者喜爱的编程语言8。此外，在前端领域也出现了众多由Rust编写的项