Pinterest轉向通用JavaScript和React

boxti發表於2017-06-05
RESTJavaScriptReact

在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的努力還在繼續。

文章轉載自 開源中國社群 [http://www.oschina.net]


相關文章