课程咨询: 400-996-5531 / 投诉建议: 400-111-8989
认真做教育 专心促就业
随着互联网的不断发展,越来越多的人都在学习web前端编程开发技术,而今天我们就通过案例分析来了解一下,web前端开发服务器渲染都有哪些问题。
静态渲染发生在构建时,并提供快速的次绘制、次内容绘制和交互时间-假设客户端JS的数量有限。与服务器渲染不同,它还设法实现始终如一的快速字节时间,因为页面的HTML不必即时生成。通常,静态呈现意味着提前为每个URL生成单独的HTML文件。通过提前生成HTML响应,可以将静态呈现器部署到多个CDN以利用边缘缓存。
静态渲染的解决方案有各种形状和大小。Gatsby之类的工具旨在让开发人员感觉他们的应用程序是动态呈现的,而不是作为构建步骤生成的。其他像Jekyll和Metalsmith这样的公司拥抱它们的静态特性,提供了一种更加模板驱动的方法。
静态呈现的缺点之一是必须为每个可能的URL生成单独的HTML文件。如果您无法提前预测这些URL的内容,或者对于具有大量独特页面的网站,这可能具有挑战性甚至不可行。
React用户可能熟悉Gatsby、Next.js静态导出或Navi-所有这些都可以方便地使用组件进行创作。但是,了解静态渲染和预渲染之间的区别很重要:静态渲染页面是交互式的,无需执行大量客户端JS,而预渲染改进了必须启动的单页应用程序的次绘制或次内容绘制客户端以使页面真正具有交互性。
如果您不确定给定的解决方案是静态渲染还是预渲染,请尝试以下测试:禁用JavaScript并加载创建的网页。对于静态呈现的页面,大多数功能在没有启用JavaScript的情况下仍然存在。对于预渲染页面,可能仍然有一些基本功能,如链接,但大部分页面将是惰性的。
另一个有用的测试是使用ChromeDevTools降低网络速度,并观察在页面变为可交互之前已下载了多少JavaScript。预渲染通常需要更多的JavaScript才能获得交互性,而且JavaScript往往比静态渲染使用的渐进增强方法更复杂。
【免责声明】:本内容转载于网络,转载目的在于传递信息。文章内容为作者个人意见,本平台对文中陈述、观点保持中立,不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。更多内容请加danei0707学习了解。欢迎关注“达内在线”参与分销,赚更多好礼。