Người dùng GitHub đã phải vật lộn với các vấn đề hiệu suất nghiêm trọng trên Safari trong nhiều tháng, khiến nền tảng này trở nên gần như không thể sử dụng được cho các tác vụ phát triển cơ bản. Vấn đề đã đạt đến mức nghiêm trọng đến nỗi ngay cả các nhà phát triển sử dụng phần cứng cao cấp như MacBook Pro M4 và Mac Studio với 64GB RAM cũng gặp phải tình trạng chậm đáng kể khi xem pull request hoặc duyệt các tệp mã nguồn.
Khủng hoảng hiệu suất này bắt nguồn từ việc GitHub chuyển đổi từ kiến trúc server-side rendering sang kiến trúc ứng dụng một trang dựa trên React. Sự thay đổi này đã tạo ra một cơn bão hoàn hảo của các vấn đề không hiệu quả, đặc biệt ảnh hưởng đến người dùng Safari - những người phải chịu đựng phần lớn các vấn đề tương thích giữa engine rendering của trình duyệt và giao diện nặng JavaScript của GitHub.
Báo cáo phần cứng bị ảnh hưởng:
- M4 MacBook Pro với 64GB RAM: Vẫn gặp phải tình trạng chậm nghiêm trọng
- M3 MacBook Pro: Chức năng tìm kiếm ngừng hoạt động trên các tệp lớn
- Mac Studio M4 Max với 64GB RAM: Chậm hơn MacBook Pro 2011 khi thực hiện cùng tác vụ
- 16-inch MacBook Pro với Apple Silicon Max 32 nhân: Hiệu suất không thể sử dụng được
Nguyên nhân gốc rễ: Quyết định kiến trúc đi sai hướng
Vấn đề cốt lõi có thể truy nguyên về quyết định của GitHub từ bỏ hệ thống server-side rendering nhanh chóng trước đây để chuyển sang phương pháp dựa trên React. Các cuộc thảo luận cộng đồng tiết lộ rằng GitHub trước đây xử lý syntax highlighting trên server, cung cấp nội dung đã được xử lý sẵn mà các trình duyệt có thể hiển thị nhanh chóng. Giờ đây, nền tảng gửi văn bản thô chưa được highlight mà phải được xử lý ở phía client, khiến các trình duyệt quá tải với các tác vụ rendering phức tạp.
Thay đổi kiến trúc này đã dẫn đến việc các pull request tạo ra hơn 100.000 DOM node, nhiều trong số đó là các phần tử SVG inline không hiển thị nhưng vẫn tiêu tốn sức mạnh xử lý. Vấn đề trở nên đặc biệt nghiêm trọng khi xem các pull request lớn với hàng nghìn dòng thay đổi, nơi quá trình rendering của Safari sử dụng tối đa CPU và khiến giao diện trở nên hoàn toàn không phản hồi.
DOM node là các phần tử riêng lẻ trong cấu trúc trang web, như văn bản, hình ảnh, hoặc các phần tử định dạng mà trình duyệt phải theo dõi và render.
So sánh Tác động Hiệu suất:
- Trước khi Chuyển đổi React: Kết xuất phía máy chủ nhanh, xử lý làm nổi bật cú pháp trên máy chủ, hiệu suất tốt trên phần cứng cũ
- Sau khi Chuyển đổi React: Xử lý phía máy khách, hơn 100.000 nút DOM cho mỗi PR lớn, mức sử dụng CPU đạt 100% trên Safari
- Hiệu suất Trình duyệt: Chrome hoạt động tốt hơn Safari , Firefox cho thấy hiệu suất tốt, Safari gần như không thể sử dụng được đối với các PR lớn
Thách thức đặc thù của Safari
Trong khi hiệu suất của GitHub đã giảm trên tất cả các trình duyệt, người dùng Safari phải đối mặt với những thách thức riêng biệt do sự khác biệt trong cách trình duyệt xử lý các thao tác CSS và DOM. Các cải tiến gần đây được merge bởi đội ngũ WebKit đặc biệt nhắm vào các vấn đề hiệu suất CSS đã khiến giao diện của GitHub chạy chậm chạp trên Safari.
Sự chênh lệch giữa các trình duyệt đã trở nên rõ rệt đến nỗi nhiều nhà phát triển báo cáo việc chuyển sang Chrome hoặc Firefox đặc biệt để sử dụng GitHub, mặc dù họ vẫn thích Safari cho việc duyệt web khác. Một số người dùng đã phát hiện ra rằng làm mới trang cứng thực sự nhanh hơn việc sử dụng navigation của ứng dụng một trang của GitHub, làm nổi bật những vấn đề không hiệu quả cơ bản trong hệ thống hiện tại.
Chi phí ẩn của phát triển web hiện đại
Tình huống GitHub phản ánh những vấn đề rộng lớn hơn trong các thực hành phát triển web đương đại. Các vấn đề hiệu suất của nền tảng không chỉ giới hạn ở Safari - người dùng báo cáo các vấn đề tương tự trên các trình duyệt khác, với ngay cả Chrome cũng gặp khó khăn trên các pull request lớn. Điều này cho thấy rằng kiến trúc cơ bản, thay vì các lỗi đặc thù của trình duyệt, mới là thủ phạm chính.
Trải nghiệm SSR GitHub cũ rất tốt. Bạn có thể review các PR khổng lồ trên bất kỳ máy nào trước khi họ thực hiện việc chuyển đổi.
Thú vị là, GitHub vẫn duy trì khả năng kích hoạt server-side rendering cho các tài khoản người dùng cụ thể, như được chứng minh bởi phản hồi của họ đối với các khiếu nại về hiệu suất trước đây. Tuy nhiên, tính năng này vẫn được ẩn khỏi người dùng thông thường, đặt ra câu hỏi về lý do tại sao công ty không quay trở lại phương pháp nhanh hơn một cách rộng rãi.
Các Giải Pháp Ẩn Của GitHub:
- Cờ hiệu kết xuất phía máy chủ (SSR) có sẵn cho các tài khoản cá nhân
- SSR cung cấp hiệu suất tốt hơn đáng kể
- Tính năng không có sẵn công khai trong cài đặt người dùng
- GitHub có thể kích hoạt SSR theo yêu cầu khi có khiếu nại về hiệu suất
Các bản sửa lỗi khẩn cấp và triển vọng tương lai
Đội ngũ WebKit gần đây đã đẩy các cải tiến hiệu suất quan trọng đặc biệt nhắm vào các vấn đề hiệu suất của GitHub trên Safari. Những bản sửa lỗi này tập trung vào tối ưu hóa CSS rendering sẽ cung cấp sự cứu trợ ngay lập tức cho người dùng Safari đang trải qua tình trạng chậm tệ nhất.
Tuy nhiên, các vấn đề kiến trúc cơ bản vẫn chưa được giải quyết. Cho đến khi GitHub giải quyết các vấn đề cốt lõi với việc triển khai React của họ hoặc cung cấp cho người dùng các tùy chọn sử dụng server-side rendering, các nhà phát triển có thể sẽ tiếp tục gặp phải sự thất vọng với hiệu suất của nền tảng, đặc biệt khi làm việc với các codebase lớn hoặc pull request phức tạp.
Tình huống này đóng vai trò như một câu chuyện cảnh báo về tầm quan trọng của việc kiểm tra hiệu suất trên các trình duyệt và cấu hình phần cứng khác nhau trong quá trình chuyển đổi kiến trúc lớn. Hiện tại, người dùng bị ảnh hưởng có thể cần dựa vào các trình duyệt thay thế hoặc chờ đợi các tối ưu hóa thêm từ cả GitHub và các nhà cung cấp trình duyệt.
Tham khảo: The Github website is extremely slow on Safari #170758