孤惯|多才多艺：你可能会错过的前端功能，前端不易( 三 ) 全文共5764字

·React—CreateReactApp已经编写了一个关于bundle大小分析的页面。
·Vue.js—与Angular类似， VueCLI提供了一个报表命令选项来获取报表文件。
Serviceworker和先进的网络应用程序
Serviceworker是在Web浏览器中运行并管理应用程序缓存的脚本，这是将Web应用程序转换为PWA或渐进Web应用程序的步骤之一。可以像浏览普通网站一样浏览PWA ，一个安全的URL ，但允许用户体验类似于从移动应用程序浏览，而不受其限制(例如，应用程序在设备上存储提交或占用大量内存) 。
·Angular—完整的框架还提供了一种管理serviceworkers的方法。
·React—这里是CreateReactApp的PWA教程。
·Vue.js—VueCLI包括PWA特性。
服务端渲染（SSR）
服务器端渲染或SSR是Angular、React和Vue.js应用程序的游戏改变器。它将组件呈现到服务器上的HTML字符串中，并直接发送到浏览器。最后，它将静态标记转化为客户端上完全交互式的应用程序。它服务于几个目标：
·提高SEO(搜索引擎优化)
·内容显示更快
以下是每个JS框架提供的解决方案：
·Angular—Angular普遍特征
·React—Next.js通常用于React应用程序。
·Vue.js—Nuxt是SSR(Vue文档)的Vue.js框架。
静态站点发生器(SSG)
随着Jamstack的增长，静态站点生成器或SSG变得不可避免。 Jamstack是一种不依赖Web服务器的Web应用程序，以下是使用SSG的优点：
·速度：静态站点生成器在构建时生成站点页面，而不是实时生成。
·安全性：不再有CMS（内容管理系统），这些系统经常被黑客攻击。
【孤惯|多才多艺：你可能会错过的前端功能，前端不易】·更容易缩放：部署驻留在可以在任何地方服务的文件堆栈中，所以在内容传递网络(CDN)中存储网站非常容易。因此，文件可以以最快的速度跨越世界。
·开发工作流程：不再为开发人员创建和管理后端服务器或数据库。
最常见的SSG有：
·Angular—Scully
·React—Gatsby(React+GraphQL),Next.js
·Vue.js—Gridsome,Nuxt
·其他编程语言—11ty,Hugo,Jekyll等等。
在开发网站时，跟踪并不是强制性的，但它对改进网站有很大的贡献。事实上，跟踪包括一组工具，工具可以在用户浏览应用程序的时候追踪其点击和行为。它允许更接近用户的需求，并通过A/B测试，在功能、行为和设计方面选择最合适的替代方案。
以下是实现跟踪和A/B测试的一些解决方案：
·Google分析—Angular教程、React教程、Vue.js教程。
·Kameleoon—AI驱动的个性化和A/B测试框架
网络性能
构建一个性能良好的网络应用程序不是一蹴而就的，而是使它快速加载保证用户享受其浏览应用程序的过程。存在各种应用洞察力网站来评估性能如谷歌的网页速度测试分析，例如Google的PageSpeedInsights 。
网页速度测试分析
谷歌Chrome控制台提供了一个有效的工具——lighthouse 。它根据五个标准(性能、渐进Web应用程序、最佳实践、访问和SEO)以及以100的满分为每个类别打分以此来评估网站性能，分析后给出提高分数的提示。
谷歌Chrome控制台提供的另一个工具是覆盖，它有助于跟踪未使用的Javascript和CSS代码，以减少文件的大小，比如会缩短智能手机的加载时间并减少数据消耗。