Cộng đồng phát triển web đang sôi nổi tranh luận về một đề xuất bổ sung khả năng templating gốc trực tiếp vào trình duyệt web. Cuộc thảo luận này tập trung vào việc giảm bớt gánh nặng khổng lồ mà các framework web hiện đại như React áp đặt lên người dùng, đồng thời làm cho việc phát triển web trở nên dễ tiếp cận hơn mà không cần các công cụ build phức tạp.
Hiện tại, mọi ứng dụng web cần nội dung động đều phải tải xuống, phân tích và thực thi mã framework trước khi có thể sử dụng được. Điều này tạo ra gánh nặng đáng kể cho người dùng, đặc biệt là những người có kết nối internet chậm hoặc thiết bị cũ. Giải pháp được đề xuất sẽ chuyển chức năng templating từ các thư viện JavaScript vào chính trình duyệt, có thể giúp hàng triệu người dùng tránh phải tải xuống mã thừa.
 |
|---|
| Một công trường xây dựng đang tiến hành, tượng trưng cho những nỗ lực không ngừng nhằm nâng cao các framework phát triển web với các giải pháp templating gốc |
Gánh nặng Framework tạo ra tác động thực tế đến người dùng
Tình trạng hiện tại của phát triển web buộc mọi trang web phải đi kèm giải pháp templating riêng. Chỉ riêng React đã có thể thêm 100KB hoặc hơn vào việc tải trang ban đầu, trong khi ngay cả các lựa chọn thay thế nhẹ vẫn cần vài kilobyte JavaScript trước khi ứng dụng có thể tương tác được. Gánh nặng này tích lũy trên hàng tỷ người dùng web trên toàn thế giới, đại diện cho sự lãng phí khổng lồ về băng thông và sức mạnh xử lý.
Cuộc thảo luận cộng đồng cho thấy sự thất vọng với tình hình này. Nhiều nhà phát triển chỉ ra rằng các nền tảng cạnh tranh như phát triển mobile gốc hoặc desktop framework đều bao gồm khả năng templating được tích hợp sẵn, mang lại cho chúng lợi thế đáng kể so với các ứng dụng web phải tự khởi tạo giải pháp riêng.
So sánh chi phí overhead của Framework hiện tại:
- React : 100KB+ trong trường hợp tệ nhất
- Các giải pháp thay thế nhẹ: Tối thiểu vài KB
- Giải pháp native: 0KB tải xuống bổ sung
- Tác động toàn cầu: Hàng tỷ người dùng bị ảnh hưởng bởi việc tải xuống dư thừa
Các phương pháp kỹ thuật đang được xem xét
Đề xuất gợi ý sử dụng tagged template literals của JavaScript làm nền tảng cho templating gốc, tránh việc phải thêm cú pháp mới vào ngôn ngữ. Cách tiếp cận này sẽ hoạt động với kiến thức JavaScript hiện có trong khi cung cấp lợi ích hiệu suất của việc triển khai gốc.
Ba mô hình reactivity chính đang được đánh giá: virtual DOM diffing (được sử dụng bởi React), template identity (được sử dụng bởi Lit), và signals-based fine-grained reactivity (được sử dụng bởi SolidJS và ngày càng được các framework khác áp dụng). Đề xuất nghiêng về việc kết hợp template identity với signals để có hiệu suất và trải nghiệm nhà phát triển tối ưu.
Tagged template literals: Một tính năng của JavaScript cho phép các hàm xử lý chuỗi template với các biểu thức nhúng, cung cấp cách tạo ngôn ngữ chuyên dụng trong JavaScript.
Các Mô Hình Phản Ứng Được Đề Xuất:
- Virtual DOM Diffing: Được sử dụng bởi React , chậm hơn nhưng quen thuộc
- Template Identity: Được sử dụng bởi Lit , nhanh hơn với ngữ nghĩa đơn giản
- Signals: Phản ứng chi tiết, nhanh nhất nhưng yêu cầu bao bọc dữ liệu
- Phương Pháp Được Khuyến Nghị: Kết hợp template identity + signals
Mối quan ngại của cộng đồng về việc tiêu chuẩn hóa
Cộng đồng phát triển web vẫn chia rẽ về việc liệu templating gốc có còn quá sớm hay không. Một số cho rằng sự đổi mới framework vẫn đang diễn ra nhanh chóng, khiến việc khóa các phương pháp cụ thể trở nên quá sớm. Những người khác lo ngại về việc lặp lại những sai lầm trong quá khứ như Web Components, mà nhiều người coi là quá phức tạp và ít được sử dụng.
Web thực sự cần templating, reactivity và data binding gốc. Tôi thậm chí không thể tưởng tượng được bao nhiêu CPU và băng thông bị lãng phí khi hàng tỷ người dùng tải xuống, phân tích và thực thi thứ gì đó như React.
Các nhà phê bình cũng chỉ ra rằng việc thêm tính năng vào tiêu chuẩn web tạo ra gánh nặng bảo trì vĩnh viễn cho các nhà cung cấp trình duyệt và khiến các dự án trình duyệt mới khó cạnh tranh hơn. Mọi API mới đều phải được triển khai và bảo trì trên tất cả các trình duyệt chính, làm tăng độ phức tạp vô hạn.
Bối cảnh lịch sử và bài học kinh nghiệm
Cuộc thảo luận thường xuyên tham chiếu đến các nỗ lực tương tự trong quá khứ, đặc biệt là XSLT và framework XUL của Mozilla. XSLT cung cấp khả năng chuyển đổi XML mạnh mẽ nhưng gặp khó khăn với đường cong học tập dốc và cú pháp dài dòng. XUL cho phép phát triển ứng dụng phong phú nhưng vẫn chỉ dành riêng cho Firefox và cuối cùng đã bị deprecated.
Những ví dụ lịch sử này nêu bật cả lợi ích tiềm năng và cạm bẫy của các giải pháp templating gốc. Trong khi chúng chứng minh rằng các hệ thống như vậy có thể hoạt động hiệu quả, chúng cũng cho thấy việc tạo ra các giải pháp được áp dụng rộng rãi và duy trì được lâu dài là khó khăn như thế nào.
Các Lựa Chọn Triển Khai Kỹ Thuật:
- Cú pháp: Tagged template literals (tính năng JavaScript hiện có)
- Mục tiêu: API dựa trên JavaScript thay vì dựa trên HTML
- Phụ thuộc: Yêu cầu hoàn thành đề xuất DOM Parts
- Hỗ trợ Trình duyệt: Sẽ cần triển khai trên tất cả các trình duyệt chính
Con đường phía trước vẫn chưa chắc chắn
Đề xuất này đại diện cho một công việc đáng kể sẽ đòi hỏi sự hợp tác giữa các nhà cung cấp trình duyệt, tác giả framework và cộng đồng phát triển web rộng lớn hơn. Thành công sẽ phụ thuộc vào việc tìm được tiếng nói chung giữa các phương pháp cạnh tranh trong khi đảm bảo giải pháp đủ linh hoạt để phát triển theo nhu cầu tương lai.
Liệu sáng kiến này có đạt được động lực cần thiết để tiêu chuẩn hóa vẫn còn phải xem. Lịch sử của nền tảng web cho thấy những bổ sung thành công thường đòi hỏi cả nhu cầu rõ ràng từ nhà phát triển và các con đường triển khai thực tế không làm tổn hại đến chức năng hiện có.
Tham khảo: The time is right for a DOM templating API