HTML First

 (html-first.com)
2 điểm bởi GN⁺ 2023-11-13 | 1 bình luận | Chia sẻ qua WhatsApp

Giới thiệu nguyên tắc HTML First

  • Tận dụng các tính năng mặc định của trình duyệt web hiện đại
  • Tận dụng sự đơn giản đến mức tối đa của cú pháp thuộc tính HTML
  • Tận dụng tính năng ViewSource của web

Mục tiêu của HTML First

  • Mở rộng số lượng người có thể tham gia làm việc trên codebase phần mềm web
  • Ở góc độ cá nhân, giúp nhiều người trở thành lập trình viên web hơn và tăng thu nhập
  • Ở góc độ kinh doanh, giảm chi phí phát triển phần mềm và tiết kiệm nguồn lực tuyển dụng

Mục tiêu thứ hai của HTML First

  • Khiến việc phát triển phần mềm web trở nên thú vị và trơn tru hơn
  • Thay vì mất nhiều năm để thành thạo công cụ và framework, có thể đạt mức thuần thục nhanh hơn với các nguyên tắc HTML First

Cách hiện thực HTML First

  • Thừa nhận rằng HTML dễ hiểu, và dùng HTML làm nền tảng không chỉ để định nghĩa nội dung và cấu trúc mà còn để thiết lập style và hành vi

Nguyên tắc: Ưu tiên cách tiếp cận Vanilla

  • Dùng thuộc tính HTML để thiết lập style và hành vi
  • Dùng các thư viện tận dụng thuộc tính HTML
  • Tránh bước build
  • Ưu tiên HTML “trần”
  • Dùng cách tiếp cận thân thiện với View-Source

Tận dụng các tính năng được trình duyệt hỗ trợ sẵn

  • Đạt được tính năng bằng cách tiếp cận “vanilla” thay vì dựa vào framework bên ngoài
  • Trước khi thêm thư viện hoặc framework, hãy kiểm tra xem có thể làm bằng HTML/CSS thuần hay không

Định nghĩa style và hành vi bằng thuộc tính HTML

  • Có thể styling bằng các thư viện SPC như Tailwind hoặc Tachyons
  • Hành vi có thể dùng các thư viện như hyperscript, Alpine
  • HTML có thể trông phức tạp, nhưng lại dễ để các lập trình viên khác hiểu và chỉnh sửa

Dùng các thư viện tận dụng thuộc tính HTML

  • Khuyến nghị dùng các thư viện tận dụng thuộc tính HTML thay vì các thư viện xoay quanh JavaScript hoặc cú pháp tùy biến

Tránh bước build

  • Các thư viện yêu cầu chuyển đổi file làm tăng gánh nặng bảo trì và cản trở tính năng ViewSource
  • Khi dùng thư viện HTML First, nhu cầu bổ sung CSS và JS riêng được giảm xuống mức tối thiểu

Ưu tiên HTML “trần”

  • Đây là nguyên tắc áp dụng tốt nhất cho phần triển khai backend
  • Ngay cả khi không biết framework backend, các lập trình viên quen với HTML vẫn có thể hiểu file view

Duy trì tính năng View-Source

  • Sức hấp dẫn của web thuở ban đầu là có thể “liếc nhìn” mã nguồn và hiểu được một phần của trang web
  • Với các trang tuân theo nguyên tắc HTML First, có thể giành lại tính năng ViewSource

Kết luận

  • Những thực hành và nguyên tắc được mô tả trên trang này vẫn là thiểu số trong toàn ngành
  • Tác giả muốn tìm kiếm và kết nối với những người đồng cảm với các ý tưởng này

Ý kiến của GN⁺

Điểm quan trọng nhất của bài viết này là việc đưa vào các nguyên tắc HTML First nhằm cải thiện khả năng tiếp cận và tính bảo trì của phát triển web. Những nguyên tắc này giúp việc phát triển web trở nên dễ dàng và nhanh chóng hơn, đồng thời mang lại lợi ích cho cả cá nhân lẫn doanh nghiệp bằng cách giúp nhiều người hơn có thể tham gia vào lập trình web. Cách tiếp cận này thú vị ở chỗ nó có tiềm năng giảm bớt độ phức tạp của phát triển web, tăng khả năng đọc hiểu mã nguồn, đồng thời thúc đẩy chia sẻ tri thức và hợp tác trong cộng đồng lập trình viên.

Bài viết liên quan

1 bình luận

 
GN⁺ 2023-11-13
Ý kiến trên Hacker News
  • Về mặt lý thuyết hoặc trong các ví dụ đơn giản thì khá thú vị, nhưng cần có các trường hợp cho thấy những nguyên tắc này đã được áp dụng thế nào vào các dự án lớn và tạo ra khác biệt ra sao.
  • Tôi đồng ý với việc tận dụng tối đa nền tảng web và giảm độ phức tạp, nhưng hoài nghi liệu những nguyên tắc được đưa ra có thực sự làm giảm độ phức tạp hay không.
  • Việc dùng các chức năng mặc định của HTML là tốt, nhưng 10 năm trước đã không thực tế và bây giờ cũng vậy; tôi không cảm thấy htmx hay các giải pháp tương tự tốt hơn những giải pháp nặng như React.
  • Khi triển khai các tính năng như dropdown, multiselect và date picker, sự thiếu nhất quán giữa các trình duyệt và khả năng styling hạn chế khiến chỉ dùng các phần tử HTML tích hợp sẵn là không đủ.
  • Ví dụ còn yếu, và việc định nghĩa style cùng hành vi bằng các thuộc tính HTML nội tuyến có thể trở nên phức tạp.
  • Khi cần dùng thư viện, tôi đồng ý với việc chọn các thư viện tận dụng thuộc tính HTML thay vì JavaScript hay cú pháp tùy biến.
  • Triết lý này rất hợp để phát triển một nền tảng SaaS được cấu thành chỉ bằng HTML markup.
  • Đây có vẻ là một anti-pattern do người chưa từng trải qua quá trình xây dựng website phức tạp đưa ra, và là lời khuyên tệ.
  • Tôi đồng ý rằng người dùng nên có thể hiểu được qua chức năng xem mã nguồn, nhưng với web app thì nên dùng ngôn ngữ có kiểu.
  • "Tính cục bộ của hành vi" là một quy tắc được định nghĩa mơ hồ, đi ngược lại sự tách biệt mối quan tâm, và việc gọi CSS là "hành động ma quái từ xa" là cách nói cường điệu.