Xuất bản: Ngày 7 tháng 11 năm 2025
Việc quản lý khả năng tương thích của trình duyệt cho hơn 38.000 khách hàng doanh nghiệp trên khắp Nhật Bản không phải là điều dễ dàng. Khi Kintone hỗ trợ các hoạt động kinh doanh quan trọng cho hơn 1,5 triệu ứng dụng mỗi ngày, mọi quyết định hỗ trợ trình duyệt đều có ý nghĩa.
Cybozu, một công ty phần mềm cộng tác hàng đầu tại Nhật Bản, phải đối mặt với một thách thức cơ bản: Làm thế nào để duy trì các tiêu chuẩn nhất quán trên web cho các sản phẩm mà không phải chịu gánh nặng bảo trì các ma trận hỗ trợ trình duyệt tuỳ chỉnh.
Giải pháp? Áp dụng Baseline làm tiêu chuẩn phát triển – một bước đi đã thay đổi cách họ tiếp cận việc áp dụng tính năng nền tảng web!
Thách thức: Hỗ trợ trình duyệt mà không cần đoán
Trước Baseline, Cybozu duy trì tiêu chí hỗ trợ trình duyệt riêng dựa trên nhật ký truy cập và hoạt động theo dõi phiên bản thủ công. Tiêu chuẩn của họ là hỗ trợ những trình duyệt chiếm 98% nhật ký truy cập hàng đầu và người dùng sử dụng những trình duyệt không đạt ngưỡng đó sẽ thấy lời nhắc cập nhật trình duyệt.
Mỗi quý, các nhóm kỹ thuật của Cybozu dành tổng cộng khoảng một giờ để cập nhật tiêu chí. Tuy nhiên, việc tích hợp các tiêu chí vào nhóm phát triển không diễn ra suôn sẻ và thường có những câu hỏi như: Khi nào có thể sử dụng các tính năng CSS mới? Khi nào có thể xoá các polyfill cho API JavaScript mới? Và thực tế là những tính năng nào có thể được sử dụng ngay bây giờ?
Không chỉ thiếu khả năng duy trì và tính hữu dụng cho các nhà phát triển, Cybozu còn nhận ra rằng việc xây dựng dựa trên tính năng phát hiện tác nhân người dùng và theo dõi phiên bản theo cách thủ công không thể theo kịp tốc độ phát triển của web hiện đại.
Có thể dựa vào chuỗi User-Agent không
Phương pháp trước đây của Cybozu là lấy tên và phiên bản trình duyệt từ các chuỗi User-Agent, sau đó tổng hợp các kết quả này thành dữ liệu "người dùng". Tuy nhiên, liệu điều này có thực sự phản ánh đúng thực tế của người dùng?
User-Agent là một tiêu đề yêu cầu HTTP – thông tin mà mọi ứng dụng có thể tuyên bố là bất cứ thứ gì. Nhật ký truy cập vào sản phẩm chứa một lượng lớn yêu cầu từ bot, trình thu thập thông tin, kẻ tấn công và các nguồn khác. Một số ứng dụng cố tình gửi các chuỗi User-Agent cũ cho nhiều mục đích, chẳng hạn như quét lỗ hổng bảo mật. Do đó, nhật ký truy cập không thể đại diện cho những người dùng cần được hỗ trợ.
User-Agent không thể phản ánh các tính năng hiện có
Các phiên bản trình duyệt không tương ứng với các tính năng. Cùng một số phiên bản có thể có các chức năng khác nhau tuỳ thuộc vào kênh (Ổn định/Beta/Nhà phát triển/Canary), cờ tính năng, thử nghiệm Finch hoặc chính sách doanh nghiệp, chẳng hạn. Ngoài ra, các trình duyệt khác nhau triển khai các tính năng ở các mốc thời gian khác nhau – CSS Nesting được phát hành trong Safari 16.5 (tháng 5 năm 2023) nhưng Chrome 112 (tháng 4 năm 2023). Chuỗi User-Agent không cho biết tính năng có dùng được hay không.
Tự chịu trách nhiệm hỗ trợ các phiên bản trình duyệt
Các bản cập nhật trình duyệt không chỉ có tính năng mới mà còn bao gồm các bản vá bảo mật quan trọng và bản sửa lỗi cùng với các chức năng mới. Khi các phiên bản cũ được hỗ trợ, việc tránh sử dụng các tính năng mới không phải là vấn đề duy nhất mà còn là một quyết định ảnh hưởng trực tiếp đến sự an toàn của người dùng. Trong môi trường doanh nghiệp, một số người dùng có thể gặp phải những hạn chế chính đáng. Ví dụ:
- Các tổ chức có thể có chính sách nghiêm ngặt về trình duyệt, ngăn chặn việc cập nhật.
- Phần cứng cũ không hỗ trợ việc cập nhật các trình duyệt hiện đại.
- Người dùng trong các ngành chịu sự quản lý có quy trình phê duyệt thay đổi chậm.
Tuy nhiên, việc hỗ trợ những người dùng đó cũng có nghĩa là họ vẫn có thể gặp rủi ro.
Nếu sự cố bảo mật xảy ra do khai thác một lỗ hổng đã biết trong phiên bản trình duyệt cũ, thì việc nói rằng "trình duyệt này được hỗ trợ vì người dùng yêu cầu" sẽ không phải là một lời giải thích hợp lý. Nếu cuộc tấn công lan rộng sang những người dùng khác duy trì trình duyệt cập nhật đúng cách, thì các nhà phát triển và các bên liên quan khác trong dự án phải chịu trách nhiệm vì không ngừng hỗ trợ các trình duyệt không an toàn.
Cybozu nhận thấy phương pháp này gây ra rủi ro cho phần lớn người dùng luôn cập nhật trình duyệt. Việc chỉ hỗ trợ các trình duyệt dựa trên số lượng nhật ký không có quy trình xác thực bảo mật phù hợp. Điều này không chỉ là bỏ lỡ các tính năng mới mà còn là không hoàn thành trách nhiệm bảo vệ người dùng.
Câu hỏi chuyển từ "Có bao nhiêu người dùng đang sử dụng phiên bản này?" thành "Chúng ta có nên hỗ trợ người dùng dựa trên phiên bản trình duyệt hay không?"
Vì sao Baseline là câu trả lời phù hợp cho Cybozu
Cybozu cần một phương pháp mới không chỉ giải quyết gánh nặng vận hành khi duy trì các tiêu chí hỗ trợ trình duyệt mà còn giải quyết những thiếu sót cơ bản trong phương pháp cũ. Baseline đã cung cấp cho Cybozu chính xác những gì họ cần.
Tiêu chí luôn thay đổi và được duy trì bên ngoài
Thay vì đánh giá lại các phiên bản trình duyệt theo cách thủ công mỗi quý, Baseline cung cấp một mục tiêu thay đổi do Nhóm cộng đồng WebDX của W3C duy trì, chứ không phải do các công ty riêng lẻ đưa ra quyết định tuỳ ý. Điều này có nghĩa là các tiêu chí sẽ tự động phát triển dựa trên thông tin đầu vào của các nhà cung cấp trình duyệt và tổ chức tiêu chuẩn.
Kintone không còn cần tự quản lý các ngưỡng phiên bản nữa – Đường cơ sở sẽ phát triển mà không cần thực hiện bất kỳ thao tác nào. Trạng thái Baseline cho các tính năng sẽ trả lời dứt khoát các câu hỏi về tình trạng cung cấp và câu trả lời sẽ tự động cập nhật khi nền tảng phát triển.
Độ chính xác ở cấp đối tượng
Thay vì cố gắng theo dõi tình trạng của từng trình duyệt, Baseline áp dụng một phương pháp hoàn toàn khác.
Baseline Widely available (Được cung cấp rộng rãi) là những tính năng web được cung cấp trong 30 tháng trở lên trên các trình duyệt chính. Khung thời gian này được xác định là "ước chừng các tín hiệu của nhà phát triển, mức độ sử dụng bản phát hành trình duyệt theo thời gian, ước tính tổng thị phần được hỗ trợ ở mức cao và đánh giá tốt nhất của Nhóm cộng đồng WebDX". Bằng cách đặt ngưỡng này, Baseline sẽ loại bỏ nhiệm vụ theo dõi các trường hợp trình duyệt riêng lẻ không thể quan sát được.
Với Baseline, nhà phát triển sẽ nhận được câu trả lời trực tiếp về khả năng sử dụng của tính năng cụ thể đó trên các trình duyệt. "Chúng ta có thể sử dụng truy vấn vùng chứa CSS không?" hiện là một câu hỏi có thể trả lời. Nhà phát triển có thể kiểm tra ngay trạng thái Baseline trên MDN hoặc các tài liệu khác mà không cần tham khảo ma trận tương thích.
Bảo mật ngay từ khâu thiết kế
Bằng cách áp dụng Baseline Widely available làm tiêu chuẩn, Cybozu đã điều chỉnh chính sách hỗ trợ của mình theo khung thời gian tương quan tự nhiên với vòng đời hỗ trợ của các nhà cung cấp trình duyệt. Những trình duyệt vẫn đang được duy trì sẽ hỗ trợ tất cả các tính năng Được cung cấp rộng rãi, đồng thời nhận được các bản cập nhật bảo mật quan trọng.
Các tiêu chí dựa trên nhật ký truy cập có khả năng hỗ trợ cho các trình duyệt lỗi thời, điều này làm mất động lực để người dùng cập nhật. Bằng cách áp dụng Baseline, chúng ta không chỉ tự tin sử dụng các tính năng hiện đại mà người dùng trên các trình duyệt lỗi thời cũng sẽ tự nhiên gặp phải nhu cầu cập nhật khi nền tảng web phát triển.
Baseline không loại trừ rõ ràng các trình duyệt dễ bị tấn công mà mang đến động lực tự nhiên để người dùng cập nhật trình duyệt của họ.
Triển khai Baseline
Để áp dụng Baseline, Cybozu cần chuyển đổi từ hệ thống quản lý phiên bản cũ. Điều này có nghĩa là Cybozu cần tin tưởng rằng Baseline sẽ hoạt động mà không có nhược điểm đáng kể. Việc biết tỷ lệ phần trăm người dùng mà tính năng này sẽ ảnh hưởng là rất quan trọng đối với việc áp dụng ở cấp doanh nghiệp.
Google Analytics Baseline Checker là một công cụ phân tích dữ liệu được xuất từ Google Analytics để cho biết tỷ lệ phần trăm người dùng hỗ trợ các tính năng của từng năm Baseline. Công cụ này đã giúp Cybozu kiểm tra tác động thực tế của việc chọn mục tiêu Cơ sở đối với người dùng của họ. Sau khi chạy Baseline Checker, Cybozu đã phát hiện ra một điều đáng chú ý:
Baseline Checker cho thấy 98,8% người dùng của Cybozu sử dụng các trình duyệt hỗ trợ mục tiêu Baseline Widely available. Đây là phạm vi rộng hơn so với tiêu chuẩn nội bộ trước đây của Cybozu là ít nhất 98% người dùng. Có 3 điểm chính có thể được phân tích dựa trên dữ liệu được cung cấp:
- Các trình duyệt được hỗ trợ trước đây sẽ không bị ảnh hưởng.
- Các trình duyệt không được hỗ trợ trước đây: chiếm khoảng 0,8% số trình duyệt đáp ứng các tiêu chí cơ bản được cung cấp rộng rãi, nhưng không còn thấy lời nhắc cập nhật trình duyệt.
- Các trình duyệt còn lại vẫn tiếp tục nhận được lời nhắc cập nhật trình duyệt như trước.
Đáng chú ý là điều này có nghĩa là bạn có thể loại bỏ các kết quả dương tính giả – khoảng 0, 8% người dùng đã không cần thiết phải thấy cảnh báo mặc dù đang sử dụng các trình duyệt có khả năng. Đồng thời, bạn không thể đưa ra kết quả âm tính giả bằng cách cảnh báo những người dùng được hỗ trợ trước đây.
Với dữ liệu này, Cybozu có thể tự tin áp dụng Baseline Widely available làm mục tiêu.
Tác động của Baseline trong thực tế
Việc áp dụng Baseline làm chính sách là một chuyện, nhưng để triển khai chính sách này, chúng tôi cần xây dựng các công cụ và quy trình. Điều này là cần thiết để đảm bảo nhà phát triển không vô tình sử dụng các tính năng không được hỗ trợ mà không kiểm tra trạng thái Cơ sở theo cách thủ công.
Phân tích tĩnh dựa trên cấu hình ESLint
@cybozu/eslint-config là một cấu hình dựa trên OSS được dùng cho các sản phẩm của Cybozu. Chế độ này được hỗ trợ bắt đầu từ chế độ cài đặt sẵn css-baseline. Chế độ này sẽ kiểm tra các tính năng CSS dựa trên Đường cơ sở tại thời điểm tạo:
// eslint.config.mjs
import cybozuEslintConfigBaseline from '@cybozu/eslint-config/flat/presets/css-baseline.js';
export default [
...cybozuEslintConfigBaseline.map((config) => ({
...config,
files: ['**/*.css']
})),
];
Khi sử dụng các tính năng chưa có trong Baseline Widely, nhà phát triển sẽ nhận được phản hồi ngay lập tức từ ESLint:
Điều này giúp ngăn các vấn đề về khả năng tương thích xuất hiện trong bản phát hành công khai. Nhà phát triển có thể đưa ra quyết định sáng suốt ngay từ đầu quy trình phát triển: Chờ tính năng này được cung cấp rộng rãi hoặc triển khai tính năng nâng cao từng bước khi biết chính xác những người dùng nào sẽ bị ảnh hưởng. (Tìm hiểu thêm về khả năng hỗ trợ CSS và đường cơ sở của ESLint.)
Định cấu hình trình chuyển đổi mã nguồn để nhắm đến Baseline Widely available
Các công cụ xây dựng hiện đại đã bắt đầu hỗ trợ Cơ sở làm mục tiêu. Ví dụ: Vite tự động nhắm đến Baseline Widely Available (Đường cơ sở có phạm vi sử dụng rộng rãi) trong quá trình phát hành chính thức mà không cần định cấu hình thêm. Browserslist hiện cũng hỗ trợ Baseline.
Việc sử dụng nhiều chế độ cài đặt trình biên dịch giúp đảm bảo rằng JavaScript và CSS của chúng tôi chỉ được chuyển đổi khi cần thiết, tránh các biến đổi và đoạn polyfill không cần thiết cho những tính năng đã được hỗ trợ rộng rãi.
Loại bỏ việc duy trì tiêu chí thủ công và hệ thống phát hiện trình duyệt để thu thập ý kiến phản hồi của người dùng
Lợi ích lớn nhất về việc duy trì là loại bỏ việc theo dõi phiên bản trình duyệt theo cách thủ công. Thay vì tổ chức các cuộc họp hằng quý để tranh luận về việc nên hỗ trợ phiên bản trình duyệt nào, Cybozu hiện dựa vào gói @web-platform-dx/baseline-browser-mapping được duy trì công khai để trả lời những câu hỏi này.
Cybozu cũng xây dựng tính năng phát hiện trình duyệt tự động để hiển thị lời nhắc nâng cấp cho người dùng sử dụng trình duyệt cũ.
Tính năng phát hiện trình duyệt sẽ tìm nạp các phiên bản trình duyệt tương thích ngay từ gói @web-platform-dx/baseline-browser-mapping.
Quy trình này diễn ra trong quá trình xây dựng của chúng tôi và tạo ra các biểu ngữ cảnh báo được chia sẻ trên tất cả các nhóm sản phẩm. Khi cửa sổ Baseline Widely available (Được hỗ trợ rộng rãi) chuyển sang bao gồm các trình duyệt mới hơn, hệ thống của chúng tôi sẽ tự động nhận biết các thay đổi mà không cần có sự can thiệp thủ công.
Đơn giản hoá việc giao tiếp
Một trong những lợi ích quan trọng nhưng không ngờ đến là cách Baseline đơn giản hoá hoạt động giao tiếp giữa các nhóm. Trước đây, các cuộc thảo luận về khả năng tương thích của trình duyệt đòi hỏi kiến thức về miền cụ thể của công ty – những trình duyệt chúng tôi hỗ trợ, những phiên bản và những tính năng hiện có. Người mới cần thời gian để tìm hiểu các tiêu chuẩn nội bộ của chúng tôi. Với Baseline, giờ đây, chúng tôi tham chiếu cùng một tiêu chí tương thích được cộng đồng web công nhận rộng rãi.
Điều này cũng tạo ra một từ vựng chung trong cả nhóm kỹ thuật của chúng tôi và với cộng đồng web nói chung. Khi thảo luận về việc áp dụng tính năng, mọi người đều tham khảo cùng một dữ liệu từ cùng một nguồn, giúp bạn không cần phải giải thích các chính sách nội bộ hoặc dịch giữa các khung tương thích khác nhau.
Các công cụ phát triển cũng đã bắt kịp: Visual Studio Code và bảng điều khiển Kiểu trong Công cụ của Chrome cho nhà phát triển hiện hiển thị trực tiếp thông tin về khả năng tương thích cơ bản. Nhà phát triển không còn cần phải liên tục kiểm tra MDN hoặc Can I use (Tôi có thể sử dụng) để xác minh xem một tính năng có an toàn khi sử dụng hay không. Công cụ sẽ thông báo cho họ ngay lập tức.
Tự tin cung cấp sản phẩm cho mọi người
Với Baseline, chúng tôi có thể thay đổi hoàn toàn cách suy nghĩ về khả năng tương thích của trình duyệt từ một gánh nặng mà chúng tôi phải quản lý thành một nền tảng mà chúng tôi tin tưởng. Chiến lược triển khai của chúng tôi tập trung vào việc tự động hoá ở mọi giai đoạn:
- Ý kiến phản hồi trong thời gian phát triển: Phân tích tĩnh và thẻ Trạng thái cơ sở.
- Xác thực thời gian xây dựng: Trình chuyển đổi mã nguồn tự động nhắm đến Baseline Widely available (Đường cơ sở có sẵn trên diện rộng).
- Phát hiện môi trường thời gian chạy: Cảnh báo cho người dùng về các trình duyệt không được hỗ trợ bằng cách sử dụng
baseline-browser-mapping. - Cập nhật liên tục: Tính năng đồng bộ hoá tự động với dữ liệu Cơ sở giúp loại bỏ việc duy trì theo cách thủ công.
Kết quả đã nói lên tất cả:
- Không mất thời gian bảo trì phiên bản trình duyệt.
- Đảm bảo độ phủ của người dùng trên 98,8% với độ chắc chắn ở cấp tính năng.
- Câu trả lời tức thì và tự nhiên cho câu hỏi thường gặp, giúp trả lời câu hỏi "chúng ta có thể dùng tính năng này trên phiên bản trình duyệt này không?"
- Từ vựng dùng chung giữa các nhóm kỹ thuật.
- Đường dẫn rõ ràng hơn để áp dụng tính năng nhắc các nhóm thảo luận về việc tích hợp tính năng mới và thời gian xoá các polyfill (nếu cần).
Đối với những tổ chức đang cân nhắc việc áp dụng Baseline, điều quan trọng là bạn phải biết việc chuyển đổi này sẽ ảnh hưởng như thế nào đến người dùng. Những công cụ như Trình kiểm tra đường cơ sở của Google Analytics giúp việc đo lường này trở nên đơn giản và dễ hiểu hơn. Sau khi tin tưởng vào dữ liệu và quyết định áp dụng Baseline, bạn có thể sử dụng hệ sinh thái ngày càng phát triển của Baseline để sắp xếp quy trình phát triển.
Nền tảng web mạnh mẽ hơn, nhất quán hơn, đáng tin cậy hơn và phát triển nhanh hơn so với trước đây. Với Baseline, chúng ta có thể khai thác sức mạnh đó trong quá trình sản xuất một cách tự tin.
Tài nguyên
- Bài viết gốc bằng tiếng Nhật: プロダクト開発の基準に Baseline を取り入れるまで - Cybozu Inside Out
- Cấu hình Cybozu ESLint:
@cybozu/eslint-configtrên GitHub - Trình kiểm tra đường cơ sở của Google Analytics: Trình kiểm tra đường cơ sở của Google Analytics
- Ánh xạ trình duyệt cơ bản:
@web-platform-dx/baseline-browser-mapping - Tìm hiểu về Baseline: Baseline tại MDN