Pinterest转向通用JavaScript和React

在2015年，Pinterest决定转向React。但是对于一个有数百万活跃用户的站点来说，谈何容易。Pinterest转向React的故事本质上是Pinterest转向通用JavaScript的故事。

\\

Pinterest的软件工程师Imad Elyafi写道，决定转向React的部分原因是React是“黄金标准”，有着“庞大的开发者社区”以及它“能极大地提升工程效率和质量”。React通常用在通用JavaScript场景下，在此服务器和浏览器使用同一类模板。

\\

Pinterest的服务器端引擎是Django，它使用Jinja模板引擎。然而，Pinterest的客户端的JavaScript使用Nunjucks，它的灵感来源于Jinja，也与之相似。这导致了代码的重复，一份Python版和一份JavaScript版。但是他们无法抛弃一切而转向React，Pinterest的软件工程师Jessica Chan说道。

\\

\

我们需要一个方案，能让我们在不打断产品组工作和影响用户体验的情况下，迭代地转换数以百计的Pinterest构件。第一步就是要将客户端和服务器端统一到单一的模板渲染引擎，然后再将引擎替换掉。如果服务器能解释JavaScript，使用Nunjucks渲染模板以及共享客户端代码，我们就能进行迭代迁移到React。

\

\\

在触及React之前，该团队重新设计了服务器渲染引擎的架构以使用现成的Nunjucks模板。Jessica Chan说，他们没有在Django的内部渲染Jinja模板，而是创建了一个进程使用Node来渲染模板。“最终，我们在Nginx代理层后使用常驻的Node进程，将接口架构设计为每一个网络请求都是无状态的渲染过程。我们因此能将请求分发到这些进程组，并在需要的时候扩展进程数。”

\\

一旦该系统上线，他们就能慢慢转向基于React的组件渲染模式。Elyafi说只要可能他们都扩展Nunjucks模板语言来渲染React。

\\

{% if in_react %}\    {{ component('MyReactComponent', {pinId: '123'}) }}\{% else %}\    {{ module('MyDenzelComponent', pinId='123') }}\{% endif %}\

\\

component关键字告诉模板引擎应该使用基于React的组件，而不是基于Nunjucks的。Pinterest转向React的努力还在继续。

\\

查看英文原文：Pinterest's Switch to Universal JavaScript and React

\\

---

感谢冬雨对本文的审校。

\

给InfoQ中文站投稿或者参与内容翻译工作，请邮件至editors@cn.infoq.com。也欢迎大家通过新浪微博（@InfoQ，@丁晓昀），微信（微信号：InfoQChina）关注我们。