Web Components là ổn

Web Components là ổn

• Cộng đồng phát triển web thường xuyên tranh luận về Web Components
• Ryan Carniato đã viết bài "Web Components Are Not the Future", và Cory LaViska đáp lại bằng bài "Web Components Are Not the Future — They’re the Present"
• Tác giả muốn giải quyết cuộc tranh luận này một cách ôn hòa

Hiệu năng

• Web Components dựa trên Custom Elements, nên mọi giao diện đều được xử lý thông qua DOM
• Tối thiểu hóa số lượng nút DOM là cốt lõi của tối ưu hiệu năng
• Tuy nhiên, hiệu năng không phải là tất cả; cũng cần cân nhắc các yếu tố khác như khả năng bảo trì, bảo mật, tính tiện dụng và khả năng truy cập
• Ví dụ, nếu không render các thuộc tính aria-* thì hiệu năng có thể được cải thiện, nhưng chúng lại là bắt buộc để đảm bảo khả năng truy cập
• Tối ưu hiệu năng là quan trọng, nhưng trên thực tế những vấn đề đơn giản hơn như layout thrashing, network waterfall, và re-render không cần thiết thường ảnh hưởng đến hiệu năng nhiều hơn

Chi phí của tiêu chuẩn

• Việc hỗ trợ tiêu chuẩn đòi hỏi phải viết thêm mã và thực thi thêm
• Tuy nhiên, hỗ trợ Web Components không phải là gánh nặng lớn
• Việc cân nhắc các tính năng mới của nền tảng web là điều tự nhiên, và điều này cũng đúng với Symbols, Proxys, Promises, v.v.
• Một bộ phận trong cộng đồng phát triển web có thể không muốn hỗ trợ Web Components, và điều đó cũng không sao
• Web là một mái lều lớn cho phép nhiều cách tiếp cận khác nhau

Kết luận

• Bản thân Web Components không có vấn đề gì, nhưng lời hứa rằng chúng có thể thay thế mọi thứ là điều nguy hiểm
• Web Components có những điểm yếu ở server-side rendering, khả năng truy cập và tính tương tác liên vận hành
• Các framework khác như React, Solid, Svelte vẫn có những lĩnh vực mà chúng thực sự tỏa sáng
• Web được sử dụng cho nhiều mục đích khác nhau, và điều đó mang lại cơ hội để thể hiện sự sáng tạo
• Web Components có thể không phù hợp với bạn, và điều đó cũng không sao

# Tóm tắt của GN⁺

• Bài viết này đưa ra nhiều góc nhìn khác nhau về Web Components và nhấn mạnh sự cân bằng giữa hiệu năng với các yếu tố khác
• Web Components không thể thay thế mọi thứ, nhưng phù hợp với một số mục đích cụ thể
• Cộng đồng phát triển web cho phép nhiều cách tiếp cận khác nhau, và điều đó thúc đẩy sự sáng tạo
• Nếu Web Components không phù hợp, bạn có thể dùng framework khác
• Các khả năng đa dạng của web mang đến những cơ hội mới cho biểu đạt sáng tạo

[GN⁺]

Ý kiến trên Hacker News

• Cảm thấy bài viết "Web Components Are Not the Future" thiếu những lập luận đủ sức thuyết phục

  • Tình trạng hiện tại của các framework frontend khá hỗn loạn
  • Không muốn phải học các framework phức tạp
  • Không muốn những tính năng kiểu phép thuật mà không có tài liệu thì không thể hiểu được
  • Web Components trực quan và cung cấp khả năng cô lập thông qua Shadow DOM
  • Nghĩ rằng trong thời đại React thì chỉ cần giữ lại JSX là được

• Mọi người bất đồng quan điểm vì theo đuổi những kiểu tối ưu hóa khác nhau

  • Ở các startup được VC hậu thuẫn, framework có thể là lựa chọn phù hợp
  • Trong các phòng thí nghiệm học thuật, Web Components với chi phí bảo trì thấp hơn sẽ tốt hơn
  • Trải nghiệm chuyển từ Vue sang Web Components rất tích cực
  • Ít phụ thuộc hơn nên dễ quản lý hơn

• Svelte hỗ trợ tạo Web Components thông qua Custom Elements API

  • Svelte được biên dịch thành JS/HTML/CSS nên có thể dễ dàng tạo ra các component có thể tái sử dụng

• Không nghĩ Web Components sẽ làm cuộc sống của lập trình viên full-stack tốt hơn

  • Phần lớn ví dụ chỉ đơn thuần là template hóa dữ liệu vào HTML
  • Đó là việc Handlebars đã làm được từ trước

• Web Components và Shadow DOM có thể cản trở hoạt động của các tiện ích mở rộng trình duyệt

  • Các nhà cung cấp trình duyệt không vội vàng giải quyết vấn đề này

• Tính tương tác đi kèm với chi phí hiệu năng

  • Nhiều framework mang theo runtime riêng nên có thể gây suy giảm hiệu năng
  • Web Components tụt hậu về mặt kỹ thuật và làm tăng độ phức tạp

• Nghĩ rằng Web Components có thể giải quyết các vấn đề frontend hiện nay

  • Hiệu năng rất tốt, có thể cuộn mượt các bảng dữ liệu
  • Đang chuẩn bị một thư viện Web Components

• Đang thừa kế một codebase JS 250.000 dòng và refactor sang Web Components

  • Đã giảm được 50.000 dòng mã
  • Điều này giúp hiểu rõ chức năng của mã hiện có

• Web Components có thể hoạt động ngay cả khi không có JS

  • Đã thử dùng vài lần cho progressive enhancement
  • Hoạt động tốt với server-side rendering

• Framework và Web Components là những công cụ giải quyết các vấn đề khác nhau

  • Framework phụ trách render giao diện theo trạng thái
  • Web Components không giải quyết bài toán quản lý trạng thái
  • Nghĩ rằng hai thứ này có thể cùng tồn tại