翻譯自 Malcolm Laing
應該爲你的應用選擇哪個工具呢？
在 2021 年創建新的React項目時，有兩個明確的選擇：NextJS 或 Create-React-App。Gatsby 已經失寵了。
由於大規模構建緩慢，NextJS成爲更好的靜態站點生成器。
讓我們回顧一下 NextJS 和 Create-React-App的優缺點，我們還將介紹哪些用例和場景更適合其中一個。
Create-React-App
Create-React-App是一個腳手架，它使我們能夠爲我們創建一個新的React應用程序。它將 webpack 和 babel 封裝在一起，組成一個新的腳本工具 react-scripts 來管理整個應用，這樣會減少很多複雜式，還有學習成本。
這意味着更新那些 “隱藏的” 依賴關係是一件容易的事。等待新版本的react腳本，然後進行更新。無需隨意修復webpack配置的重大更改。
使用Create-React-App的優勢
比較自由
歡迎您使用任何您喜歡的庫，沒有規則或建議，您可以使用任何您喜歡的路由庫。
在客戶端 render （渲染）
由於 Create-React-Apps 在客戶端渲染，因此部署非常容易。
您可以將應用程序託管在任何文件主機上，如s3。客戶端渲染的應用程序更易於使用和部署。
Create-React-App的缺點
很難定製。
如果您需要自定義Webpack配置，您唯一的選擇是使用第三方工具，如craco或 eject(彈出，它本身提供的功能）。
一旦被彈出（eject），你就失去了使用Create-React-App的大部分好處。
抽象了複雜性。
如果你要做 Create-React-App 支持的事情，它可以工作得很好，否則會很複雜。
因爲它通過隱藏babel和webpack 配置的複雜性，以致於 Create-React-App 可以輕鬆上手。
但是它阻止開發人員更多地瞭解這些重要工具是如何工作的。
對搜索引擎優化不好
由於它在客戶端提渲染，它與搜索引擎優化作鬥爭，不應該用於電子商務或營銷工作。
NextJS
將 NextJS 與 Create-React-App 進行比較幾乎是不公平的，因爲 使用 NextJS 的開發者要多得多。
因爲 CRA 只是一個腳手架工具，但是 Nextjs 是一個構建 React 應用的框架。
開箱即用，它爲您提供服務器端渲染、靜態站點生成、無服務器功能等等。
它是一個工具箱，爲您提供創建高性能web應用程序所需的一切。
使用NextJS的優勢
快速。
由於服務器端渲染和靜態站點生成，NextJS應用程序飛速發展。
爲我們的應用進行許多性能優化，將性能作爲默認設置。
它易於部署。
Vercel (NextJS背後的公司) 使部署全棧React應用程序變得容易。
只需點擊幾下，您就可以建立一個專業的部署管道。這包括預覽部署和生產部署。
它爲我們提供了API路由。
NextJS爲我們提供了一種在應用程序中構建api的快速簡便的方法。
如果您的應用程序使用第三方API，您通常需要自己的API來代理請求並對令牌保密，NextJS的API路由非常適合此用例。
易於定製。
NextJS允許我們自定義babel或webpack配置，添加webpack加載器或babel插件很容易。
使用NextJS的缺點
很固執
NextJS中只有一種處理路由的方法，您不能自定義它。
NextJS僅限於其基於文件的路由器，並且動態路由僅在與NodeJS服務器一起使用時纔可能。
根據應用場合應當如何選擇呢？
何時使用NextJS
當構建落地頁面時
NextJS在製作落地頁面和其他營銷材料方面大放異彩。
當搜索引擎優化重要時。
在創建電子商務網站時，搜索引擎優化比以往任何時候都更加重要。
由於服務器端渲染，NextJS在這個技術大放異彩。
當建立這種網站時。
在服務器上渲染我們的應用程序可以減輕客戶端渲染的負擔。
對於使用較慢設備的用戶，這可能導致更快的加載時間。
何時使用Create-React-App
構建後臺應用時
如果您的應用程序僅對經過身份驗證的用戶可用，那麼它將失去服務器端渲染的大部分好處。
對於此用例，客戶端渲染的應用程序運行良好，並且更易於託管且更便宜。
構建 web 應用程序時。
Web應用程序通常從服務器端渲染中獲益較少。
它們通常被重複使用的用戶使用，我們可以使用緩存爲它們提供閃電般的加載時間，而無需SSR的成本或麻煩。