Bỏ qua tới nội dung
Kiến thức Website· ·12 phút đọc

Angular là gì và vì sao framework này không phải lựa chọn cho mọi website

Nguyen Hien
Angular là gì và vì sao framework này không phải lựa chọn cho mọi website
Cỡ chữ

Angular là gì, giải thích không cần biết lập trình

Angular là một JavaScript framework (bộ khung lập trình JavaScript) dùng để xây dựng giao diện ứng dụng web phức tạp. Hiểu đơn giản: nó là bộ công cụ giúp lập trình viên xây phần người dùng nhìn thấy và tương tác trên trình duyệt, theo một cấu trúc có tổ chức và nhất quán.

Angular do Google phát triển và dùng chính trong nhiều sản phẩm nội bộ của họ. Điều này thường được đề cập như một điểm cộng, nhưng cũng đồng nghĩa với framework này được thiết kế theo tiêu chuẩn của một tổ chức lớn, không hoàn toàn tối ưu cho dự án nhỏ hay đội vài người.

Angular sử dụng TypeScript (một ngôn ngữ mở rộng của JavaScript, có thêm kiểm tra kiểu dữ liệu) làm ngôn ngữ chính. Điều này mang lại ưu điểm khi code lớn nhưng cũng tăng độ khó khi bắt đầu. Bạn có thể đọc thêm về TypeScript là gì nếu muốn hiểu rõ hơn phần nền này.

AngularJS và Angular hiện đại khác nhau ra sao

Đây là điểm gây nhầm lẫn rất phổ biến. AngularJSAngular (từ phiên bản 2 trở đi) là hai thứ hoàn toàn khác nhau, dù tên gần giống nhau.

AngularJS ra đời năm 2009, cũng do Google làm, và từng rất phổ biến khoảng 2010 đến 2015. Nhưng khi web phát triển, AngularJS tỏ ra quá chậm và khó mở rộng. Google quyết định viết lại từ đầu thay vì nâng cấp, và đặt tên sản phẩm mới là Angular 2 vào năm 2016. Từ đó về sau, “Angular” chỉ phiên bản mới này, còn AngularJS vẫn là tên gọi của phiên bản 1 cũ.

Tiêu chíAngularJS (phiên bản 1)Angular (phiên bản 2 trở lên)
Ngôn ngữJavaScript thuầnTypeScript
Ra đời20092016
Kiến trúcMVC (Model-View-Controller)Component-based (dựa trên thành phần)
Hiệu suấtChậm hơn khi dữ liệu lớnTốt hơn đáng kể
Còn được hỗ trợNgừng hỗ trợ từ 2021Vẫn phát triển tích cực

Nếu bạn đang tìm dev bảo trì một hệ thống cũ có dùng AngularJS, đây là vấn đề cần chú ý: AngularJS không còn được cập nhật bảo mật, tìm dev AngularJS cũng ngày càng khó. Lộ trình đúng là migrate (chuyển đổi) sang Angular hiện đại hoặc một framework khác.

So sánh AngularJS phiên bản cũ và Angular hiện đại về ngôn ngữ, kiến trúc và hiệu suất
Điểm khác biệt chính giữa AngularJS cũ và Angular hiện đại

Angular xuất hiện ở đâu trong quá trình làm website

Giống Vue.js, Angular là công cụ phần frontend, tức xử lý phần giao diện người dùng nhìn thấy trong trình duyệt. Nhưng Angular đi xa hơn hầu hết framework khác ở chỗ: nó cung cấp sẵn gần như mọi thứ cần cho một ứng dụng frontend hoàn chỉnh.

Thay vì chỉ lo phần giao diện và để dev tự tìm thêm thư viện cho routing (điều hướng trang), form validation (kiểm tra biểu mẫu), hay kết nối API, Angular tích hợp sẵn tất cả những thứ đó. Dev không cần lắp ghép nhiều thư viện từ nơi khác, mọi thứ đều theo một khuôn chung của Angular.

Cách làm này có ưu và nhược điểm rõ ràng. Ưu điểm: code lớn vẫn dễ kiểm soát, team nhiều người cùng làm sẽ ít xung đột hơn vì tất cả đều theo cùng một quy chuẩn. Nhược điểm: muốn làm gì cũng phải học “kiểu của Angular”, không linh hoạt như Vue hay React, và dự án nhỏ thì Angular “nặng” hơn mức cần thiết.

So sánh Angular với Vue và React để thấy rõ từng lựa chọn

Ba framework này thường xếp cạnh nhau vì đều giải quyết bài toán tương tự. Hiểu điểm khác biệt giúp bạn ra quyết định đúng hơn khi nghe dev tư vấn.

Tiêu chíAngularVueReact
Ngôn ngữ chínhTypeScript (bắt buộc)JavaScript (TypeScript tùy chọn)JavaScript (TypeScript tùy chọn)
Độ phức tạp họcCao nhấtThấp nhấtTrung bình
Kích thước bundle gốcNặng nhấtNhẹ nhấtTrung bình
Cấu trúcCứng, đầy đủ sẵnLinh hoạt, tự lắp ghépLinh hoạt, tự lắp ghép
Phù hợp nhất choHệ thống nội bộ lớn, team 5 người trở lênDự án vừa nhỏ, team nhỏỨng dụng phức tạp, cần hệ sinh thái rộng

Một quan sát thực tế từ cộng đồng lập trình viên: Angular thường xuất hiện trong đề tuyển dụng của công ty phần mềm lớn hoặc doanh nghiệp outsource cho thị trường châu Âu. Còn Vue và React phổ biến hơn trong startup và dự án sản phẩm trong nước. Không có cái nào “tốt hơn” về tuyệt đối, chỉ có cái nào phù hợp hơn với từng loại dự án.

So sánh Angular, Vue và React theo độ phức tạp, kích thước và loại dự án phù hợp
Angular, Vue và React khác nhau chủ yếu ở cấu trúc và loại dự án phù hợp

Loại website nào phù hợp với Angular, loại nào nên tránh

Angular hợp nhất với những dự án có quy mô lớn, nhiều tính năng phức tạp và team làm việc nhiều người. Nếu thiếu một trong những yếu tố này, Angular thường là lựa chọn thừa.

Phù hợp với Angular: hệ thống quản lý nội bộ doanh nghiệp (ERP nhẹ, portal nhân viên, hệ thống chấm công, quản lý kho), ứng dụng có nhiều người dùng đồng thời cùng thao tác, sản phẩm phần mềm cần tích hợp nhiều module và cần kiến trúc phần mềm rõ ràng để team lớn phân chia công việc.

Không phù hợp hoặc quá mức cần thiết: website giới thiệu doanh nghiệp, landing page bán hàng, blog, website thương mại điện tử vừa nhỏ, trang cần SEO tốt nhưng không muốn cấu hình phức tạp. Những loại này dùng WordPress, Next.js hay thậm chí HTML thuần đều ra sản phẩm nhanh hơn và nhẹ hơn.

Nếu dự án của bạn là web giới thiệu dịch vụ có thêm vài tính năng tương tác như form đặt lịch hay bộ lọc sản phẩm, Vue hoặc React sẽ phù hợp hơn Angular nhiều. Angular chỉ phát huy hết thế mạnh khi dự án đủ lớn để cấu trúc cứng của nó trở thành điểm cộng thay vì gánh nặng.

Phân loại loại dự án phù hợp và không phù hợp với Angular framework
Khi nào nên chọn Angular và khi nào nên xem xét lựa chọn khác

Chủ doanh nghiệp cần biết gì trước khi chọn Angular

Nếu đội dev đề xuất Angular cho dự án của bạn, có mấy câu hỏi đáng hỏi ngược lại. Thứ nhất: “Dự án này có đủ lớn để cần Angular không, hay Vue hoặc React là đủ?” Câu hỏi này không phải để thách thức dev, mà để chắc chắn bạn không trả tiền cho độ phức tạp không cần thiết.

Thứ hai: “Team có kinh nghiệm TypeScript không?” Angular dùng TypeScript là bắt buộc. Dev giỏi TypeScript thường có lương cao hơn dev JavaScript thông thường, và thị trường tuyển dụng cũng hẹp hơn. Nếu sau này bạn cần thêm người hoặc thay người, tìm dev Angular ở Việt Nam không dễ bằng tìm dev Vue hay React.

Điều đáng chú ý nữa: Angular thường đi cùng Bootstrap trong các dự án cũ, vì cả hai đều đến từ hệ sinh thái doanh nghiệp và có thiết kế “an toàn, đồng nhất”. Dự án mới thường chọn Tailwind CSS hoặc Angular Material thay vì Bootstrap, nhưng bạn vẫn sẽ gặp tổ hợp Angular + Bootstrap trong các hệ thống được xây từ 2016 đến 2020.

Muốn đặt Angular cạnh các lựa chọn khác trước khi chốt, bài so sánh framework web JavaScript và Ruby xếp chúng theo cùng một bộ tiêu chí.

Câu hỏi thường gặp

Angular có miễn phí không?

Có. Angular là dự án mã nguồn mở, giấy phép MIT, không có phí bản quyền. Chi phí dự án Angular đến từ tiền công lập trình viên và thường cao hơn các framework khác vì đòi hỏi kỹ năng TypeScript và kiến trúc phần mềm phức tạp hơn.

Angular và AngularJS có thể dùng cùng nhau không, hay phải chọn một?

Hai framework này hoàn toàn khác nhau và không tương thích. Không thể nâng cấp từng phần từ AngularJS sang Angular, phải viết lại (migrate). Nếu hệ thống đang chạy AngularJS, nên lên kế hoạch migrate toàn bộ sang Angular hoặc framework khác, đặc biệt vì AngularJS ngừng được cập nhật bảo mật từ tháng 12 năm 2021.

Web làm bằng Angular có SEO tốt không?

Angular thuần tạo ra SPA (single-page application) render trên trình duyệt, khiến Google gặp khó khi đọc nội dung. Để có SEO tốt, cần cấu hình thêm SSR (server-side rendering) bằng Angular Universal, hoặc dùng pre-rendering. Nếu SEO là ưu tiên hàng đầu, nhiều đội dev sẽ chọn Next.js hoặc Nuxt.js thay vì Angular.

Dự án đang dùng Angular, muốn thêm người làm cần tìm loại dev nào?

Tìm dev có kinh nghiệm TypeScript và Angular cụ thể, không chỉ JavaScript chung. Khi đăng tuyển, ghi rõ phiên bản Angular đang dùng (Angular 12, 14, 17 hay mới nhất) vì có sự khác nhau nhất định giữa các phiên bản lớn. Dev Angular thường hoạt động nhiều ở các công ty outsource, đội tìm kiếm trên LinkedIn sẽ hiệu quả hơn các kênh tuyển dụng thông thường.

Đọc tiếp

Bài viết
cùng chủ đề.

Tất cả bài viết