目录
前端技术发展轨迹现代化的前端技术架构前端技术发展轨迹
现代化前端技术体系结构
从CSR SSR NSR ESR渲染方案的演进看前端架构的演进方向
CSR:Client Side Rendering浏览侧显特征：实现前端框架的分离， 实现前端框架分离的TTFB (头部字节时间=TCP连接时间获得HTTP请求发送时间响应消息的第1字节的时间)时间虽然最小，但是客户端和服务端可以多次进行交互(获取静态资源、获取数据) 真实的头屏效果和FCP SSR:Server Side Rendering服务端的呈现定义：通过在服务器端完成页面模板、数据的预取、输入，在服务器端将完整的HTML内容返回给浏览器发展为“流服务器渲染”(SSR渲染)或“编程渲染”(Progressive Rehydration )流SSR渲染，服务器通过流向浏览器提供HTML内容在React中，可以使用renderToNodeStream ()方法完成流式SSR呈现。 渐进式SSR渲染允许在hydrating还没有完全结束之前部分渲染和注入的页面内容，并允许交互式响应。 React专门宣传并讨论了Partial Hydration。 NSR:Native Side Rendering缓存的客户端渲染定义：是hybrid特有的渲染技术。 简单来说，就是在Native渲染中生成HTML数据并将其缓存在客户端上。 特点用户访问hybrid WebView时，优先从脱机软件包加载脱机页面模板，并通过前端的Ajax/或客户端功能请求数据。 要最终完成页面的完整显示，请将服务器的渲染工作放在单独的移动设备上，使用脱机存储技术实现页面预加载，而不会增加服务器压力(ESR ) 在靠近物品和数据来源的一侧，采用网络、计算、存储、APP核心能力为一体的开放平台，提供就近的服务。 它在边缘启动，生成更快的网络服务响应，满足实时业务、APP应用智能、安全和隐私保护等行业的基本需求。 边缘计算位于物理实体和工业连接之间，或者位于物理实体的顶部。 云计算允许访问边缘计算的历史数据。 (特征ESR渲染利用了CDN能力。 ESR通过CDN缓存页面的静态部分，以便在用户访问页面时可以快速返回到用户的静态内容。 它还在CDN节点上发起动态部分内容请求，获取动态内容后，继续通过流媒体方式返回用户。