12、全栈Angular与服务器渲染：从挑战到解决方案

全栈Angular与服务器渲染：从挑战到解决方案

在Web开发领域，如何将客户端JavaScript应用与SEO友好、高性能的网站相结合，一直是开发者面临的重要挑战。下面将深入探讨相关技术和解决方案。

性能优化与沃尔玛的下一步计划

在服务器处理工作时，无论同步还是异步执行，所需时间基本相同，因为要完成的工作量是相等的。不过，组件记忆化和模板化能减少后续重新渲染相同组件的CPU总时间。这些渲染优化可以与异步渲染等其他性能增强手段结合使用。

沃尔玛接下来的计划包括：
1. 持续识别并解决性能瓶颈问题。
2. 准备好后，启用同构开关，利用单页应用（SPA）模型进行后续“页面”渲染。
3. 最终将所有成果开源。

全栈Angular开发的挑战与探索

2012年12月，作者加入GetHuman，面临构建一个丰富、实时版本的旗舰网站GetHuman.com的任务。挑战在于将客户端JavaScript应用与SEO友好、高性能的网站结合起来，而当时常见的解决方案都存在明显缺点。

• Rails方法 ：构建服务器端网站，在各页面添加少量JavaScript。该方法对SEO和性能有较好表现，但无法利用高级客户端功能，用户体验类似传统网站，并非理想选择。
• 无头浏览器方法 ：使用如PhantomJS的无头浏览器缓存客户端应用视图快照，以确保客户端应用在搜索引擎中可见。然而，无头浏览器运行时速度慢，且对于像GetHuman这样拥有数十万页面的网站，资源消耗过大。

同构Ja