Như đã đề cập ở bài trước, Vue Storefront là một giải pháp front-end, hiện đang được dùng để lập trình các dự án PWA, được viết dựa trên nền tảng Vue.js. Vậy, lý do nào khiến Vue Storefront sử dụng Vue.js thay vì các nền tảng JavaScript phổ biến khác, cụ thể là “kỳ phùng” React.js. Hãy cùng nghe chia sẻ của chính CTO Vue Storefront, Piotr Karwatka, về những lý do chính khiến Vue Storefront không lựa chọn React.js mà lại sử dụng Vue.js.
Lưu ý là nội dung bài viết dưới đây là góc nhìn của chính Vue Storefront chứ không nhằm mục đích so sánh 2 nền tảng trên với nhau.
Đầu tiên phải nói đến mục đích của các nhà phát triền Vue Storefront từ ban đầu là tạo ra một nền tảng thương mại điện tử linh hoạt, dễ sử dụng và có khả năng phát triển nhanh chóng. Mà so với React.js thì đây là thế mạnh của Vue.js, vì thế đây chính là lý do đầu tiên khiến Vue.js được lựa chọn làm nền tảng cho giải pháp front-end này.
Learning curve – Tốc độ lĩnh hội
Learning curve là một thuật ngữ chỉ tốc độ lĩnh hội hay đường cong học tập (được thể hiện qua một biểu đồ mô tả quá trình học hỏi một thứ gì mới với trục tung là lượng kiến thức học được và trục hoành là thời gian).
React.js bản chất là một thư viện JavaScript, điều này có nghĩa là React.js chứa tất cả các khái nhiệm cơ bản của JS và tận dụng được hết các ưu điểm của JS. Bạn chỉ cần code giao diện với một số JSX injections. React.js thường được nhiều lập trình viên destop/ mobile app dùng và ít phổ biến hơn ở cộng đồng các lập trình viên front-end đi lên từ HTML+CSS cổ điển.
Điều này cũng không có gì là không ổn cả, tuy nhiên khi nếu nhìn vào giới lập trình thương mại điện tử nơi mà nhiều lập trình viên dày dặn kinh nghiệm với các nền tảng “cổ điển” có phần cồng kềnh như Magento, Prestashop và thậm chí cả Shopify, chúng ta có thể thấy rằng họ đang tìm kiếm một thứ gì đó hiệu quả hơn.
Và thế là Vue.js xuất hiện – nằm giữa một Angular đồ sộ và React tinh giản. Ngoài ra, Vue.js còn có một lợi thế nữa đấy là một thư viện tài liệu tốt nhất mà một lập trình viên có thể tìm thấy.
Bàn về learning curve, thì React đòi hỏi các lập trình viên phải nghiên cứu một số lượng kiến thức khá nhiều thì khi học Vue.js họ sẽ thấy fun hơn nhiều.
Hệ thống template đi kèm với các mixins cũng mang lại một nền tảng cơ bản cho framework tổng thể này vốn dĩ đã linh hoạt, dễ hiểu và dễ mở rộng.
Thêm nữa, hệ sinh thái Vue.js (Vuex, Nuxt.js ..) khá mạch lạc, dễ lựa chọn giải pháp phù hợp khi gặp vấn đề. Về mặt này, Vue.js giống Python/.NET hơn là Java (vì với Java thì các lập trình viên cần phải hiểu được những kiến thức cơ bản, tìm ra 10 cách triển khai rồi từ đó mới chọn ra được phương án triển khai phù hợp nhất).
Kiến trúc và hiệu năng
Vue.js cũng sử dụng DOM ảo giống React, vì thế hiệu năng của cả hai là tương đương. Vuex (thư viện giúp quản lý trạng thái các component trong Vue.js) thực hiện phần lớn cách quản lý dữ liệu giống như Redux và với Nuxt.js, Vue.js hỗ trợ toàn bộ SSR – Server-Side Rendering (hỗ trợ native SSR).
Tính năng hỗ trợ SSR đặc biệt quan trọng vì đội ngũ Vue Storefront muốn nền tảng này thân thiện với SEO (SEO friendly) nhất có thể.
Chúng ta cũng có thể sử dụng tất cả các công cụ hiện đại như Webpack, Babel (thậm chí cả JSX components cũng có thể được sử dụng với Vue.js mà chẳng gặp bất kỳ khó khăn gì). Ngoài ra, Type Script cũng được hỗ trợ và còn nhiều thứ khác nữa.
Ngay đến thiết kế logo của Vue Storefront cũng đủ cho thấy đội ngũ phát triển nền tảng này kết Vue.js thế nào 🙂
Độ phổ biến
Cả React và Vue.js đều đang được sử dụng cực kỳ phổ biến – ở thời điểm viết bài viết này, React có 88K stars trên Github và Vue.js cũng không kém cạnh gì với 83K 🙂 Google Trends thậm chí còn cho thấy hệ sinh thái Vue.js phát triển nhanh hơn nhiều so với React (có thể do React xuất hiện trên thị trường đã khá lâu và số lượng người dùng cũng đã gần bão hòa).
Nhìn vào biểu đồ hành trình của các nền tảng JS đến và đi, Vue.js xuất hiện cũng được một thời gian (từ 2014) và vẫn tiếp tục phổ biến hơn mỗi tháng.
Google Trends; Xanh — Vue.js; Đỏ — React; Vàng — Angular
Với một hệ sinh thái phát triển ngày càng mạnh mẽ và hàng loạt các sự kiện công nghệ như Vuejs.amsterdam, Vue.js US và Vue.js EU, Vue.js đã gắn kết được một cộng đồng hàng nghìn nhà lập trình trên khắp Thế giới.
PWA Studio và các ứng dụng tương tự dựa trên React
PWA là một chủ đề nóng hiện nay và ngày một nhiều dự án PWA cho Thương mại điện tử đang được phát triển đặc biệt là cho Magento. Phần lớn các dự án kiểu này lựa chọn sử dụng React. Vì thế, chúng tôi đang thử phát triển một giải pháp thay thế, tập trung xây dựng một framework thứ hai với một kiến trúc hoàn toàn khác. Mục đích không phải là để cạnh tranh với Magento (hiện đang xây dựng PWA Studio với React) mà là phát triển một cái gì đó mang tính bền vững hơn.
Lý do là số lượng các nhà lập trình có kinh nghiệm về React trên thị trường không nhiều. Trong khi đó Vue.js thì dễ học và sử dụng hơn (so với React) như vậy một đội ngũ phát triển khi cần có thể chuyển từ các công nghệ khác đang dùng sang Vue.js. Thực tế là đã có nhiều đội ngũ có thể xây dựng một cửa hàng ảo hoàn thiện với Vue.js chỉ trong vòng 2-3 tuần.
Về Vue Storefront
Vue Storefront là một giải pháp front-end độc lập được viết dựa trên Vue.js, dùng để lập trình các dự án PWA thương mại điện tử . Do chạy độc lập không dựa trên một nền tảng back-end nào nên Vue Storefont có thể được sử dụng để tạo nên giao diện PWA cho bất kỳ một dự án Magento, Spotify, BigCommerce, WooCommerce, vv…bất kỳ.
Vue Storefront là và sẽ luôn là một giải pháp mã nguồn mở. Điều đó có nghĩa là bất kỳ ai cũng có thể sử dụng Vue Storefront và hỗ trợ Vue Storefront. Đội ngũ này mong muốn đây sẽ là một công cụ cải thiện trải nghiệm mua sắm trực tuyến. Vue Storefront vẫn đang được tiếp tục phát triển ngày càng thu hút được sự đóng góp của đông đảo các nhà lập trình.
—
Là đối tác của Vue Storefront và là một trong những công ty đầu tiên ứng dụng Vue Storefront vào các dự án PWA trên thị trường, đội ngũ Sutunam mong muốn được kết nối nhiều hơn với những nhà lập trình đã từng làm hoặc quan tâm đến giải pháp này, hãy cùng tìm hiểu và gia nhập cộng đồng Vietnam Vue Storefront Community tại đây để trao đổi và cùng học hỏi thêm nhé!
