Tại sao Internet Explorer lại chậm hơn nhiều so với Google Chrome?
Đặc điểm gì ở cả 2 trình duyệt này đã tạo nên khác biệt này. Bạn nào rành công nghệ có thể giúp giải thích cho mình hiểu ko nhỉ? :D:D
internet explorer
,google chrome
,trình duyệt
,tốc độ
,công nghệ thông tin
Good question.
Có rất nhiều lý do, và để trả lời thông suốt, mình bắt đầu bằng việc giải thích "tại sao người ta là thấy chậm?"
Một trang web khi bấm vào sẽ diễn ra các công đoạn đại khái như sau:
- Tìm DNS dựa vào địa chỉ
- Tìm host dựa vào DNS
- Mở kết nối với host
- Nhận dữ liệu HTML đầu tiên từ host
- Phân tích HTML thành cây DOM
- Trích xuất CSS file từ HTML và mở kết nối với host để tải CSS file
- Khởi động quá trình phân tích style từ CSS
- Khởi động quá trình phân tích layout từ DOM
- Trong quá trình phân tích layout, nếu gặp JS file thì mở kết nối với host để thải JS
- Khởi động quá trình phân tích JS
- Đăng ký vùng nhớ trong quá trình chạy JS
- Tìm và tải hình ảnh từ host
- Kết thúc lần xây dựng layout đầu tiên
- Thực thi hàm paint trên mỗi phần tử trong DOM
- Composite layers
- Chuyển kết quả hiển thị từ CPU sang GPU
- Rasterise trên GPU
- Chuyển kết quả từ GPU lên màn hình và hiển thị cho chúng ta
Cũng cần hiểu rõ quá trình thực thi một lần bấm gì đó trên trang web diễn ra như thế nào:
- Bấm vào một vị trí nào đó trên trang web đang hiển thị
- Trình duyệt phân tích vị trí, và tìm kiếm trên layout để xác định đối tượng bị bấm trúng
- Suy ngược lại nút DOM của đối tượng bị bấm đó
- Kiểm tra danh sách listener của nút DOM
- Gọi hàm JS của listener tương ứng
- Thực thi JS và thay đổi layout/style của nhiều nút DOM khác
- Tính toán lại layout và style của các nút DOM bị ảnh hưởng
- Lại paint lại các nút DOM
- Lại composite layout
- Lại chuyển kết quả từ CPU sang GPU
- GPU lại rasterise chúng
- Lại chuyển kết quả lên màn hình
Giờ trả lời câu hỏi chính của bạn:
Có quá nhiều bước thực hiện, và có rất nhiều cách tối ưu tốc độ khác nhau...
Đầu tiên, bạn nên biết Google sở hữu công cụ tìm kiếm nổi tiếng nhất thế giới. Khi bạn tìm kiếm trên Google bằng Chrome, nhiều khi bạn chưa bấm vào kết quả thì Chrome đã làm xong một loạt bước và mở kết nối với host rồi.
Thứ hai, bạn cũng nên biết Google là công ty rất giàu, và nó giàu nhờ internet. Vì vậy, nó cũng triển khai máy chủ và router đi khắp nơi trên thế giới, việc này giúp cho nó có thể tự tìm đường tối ưu để kết nối với host và tốc độ nhanh hơn mọi đối thủ.
Thứ 3, Chrome chạy song song rất nhiều process. Việc này giúp xử lý nhiều việc cùng lúc hơn là bị nghẽn ở việc đọc/ghi và chờ đợi. Chuyện này phải người trong nghề mới biết. Thực ra nó là nguyên nhân chính, nhưng nếu bạn chưa hiểu thì cứ bỏ qua.
Thứ 4, Chrome phân tích HTML, CSS, JS song song càng nhiều càng tốt. Về nguyên tắc, các thứ này cần phải làm theo trình tự, nhưng các kỹ sư đủ thông minh có thể tái cấu trúc để làm song song nhiều nhất có thể, cái nào cần đợi thì sẽ đợi, không cần đợi sẽ làm song song. Thuật ngữ trong ngành người ta hay gọi là multithreading và map-reduce.
Thứ 5, bộ core của Chrome là V8. Ai mà tìm hiểu sâu sẽ biết V8 có tốc độ xử lý rất khủng khiếp. Nguyên tắc của nó là dịch lại mã JS để có thể cùng xử lý một nhiệm vụ nhưng tốn ít bước hơn. Để giải thích dễ hiểu thì những dòng code mà dev viết thường là viết theo kiểu dễ đọc, dễ hiểu và dễ phát triển tiếp, nhưng nó không hẳn là tối ưu cho CPU xử lý. Công đoạn dịch lại để tương thích cao với mã máy là một thứ rất khó, nhưng V8 đã làm rất hiệu quả.
Cuối cùng (nhưng chưa phải tất cả), Internet Explorer với bộ core Trident đã phạm một lỗi thiết kế chết người: đó là cho phép CSS được can thiệp vào JS. Đại khái là CSS sẽ tối ưu khi chạy trên GPU, còn JS thì luôn phải chạy trên CPU. Việc cho phép CSS điều khiển JS sẽ dẫn tới tình trạng: JS cập nhật CSS, CSS cập nhật JS chỗ khác, JS lại cập nhật CSS chỗ khác nữa,... Điều này khiến IE không thể tối ưu bằng việc sử dụng GPU được, vì nếu dùng GPU sẽ dẫn tới tình trạng xử lý ở CPU một chút rồi GPU một chút,... và rất tệ.
Việc này đúng là cũng khó trách IE, vì thời đầu người ta không có chế ra GPU, lúc đó toàn là CPU cả nên IE không đến nổi tệ. Chỉ là sau này do nhu cầu của giới game thủ nên mới có GPU riêng, và kết quả khiến cấu trúc của IE trở nên lỗi thời, và bị lỗi nghiêm trọng.
Note: Tôi là một trong những người nghiên cứu về tối ưu tốc độ của ứng dụng canva.com, và vì thế tôi cũng tìm hiểu rất kỹ về vấn đề tối ưu của các trình duyệt.
Kha Nguyen
Good question.
Có rất nhiều lý do, và để trả lời thông suốt, mình bắt đầu bằng việc giải thích "tại sao người ta là thấy chậm?"
Một trang web khi bấm vào sẽ diễn ra các công đoạn đại khái như sau:
Cũng cần hiểu rõ quá trình thực thi một lần bấm gì đó trên trang web diễn ra như thế nào:
Giờ trả lời câu hỏi chính của bạn:
Có quá nhiều bước thực hiện, và có rất nhiều cách tối ưu tốc độ khác nhau...
Đầu tiên, bạn nên biết Google sở hữu công cụ tìm kiếm nổi tiếng nhất thế giới. Khi bạn tìm kiếm trên Google bằng Chrome, nhiều khi bạn chưa bấm vào kết quả thì Chrome đã làm xong một loạt bước và mở kết nối với host rồi.
Thứ hai, bạn cũng nên biết Google là công ty rất giàu, và nó giàu nhờ internet. Vì vậy, nó cũng triển khai máy chủ và router đi khắp nơi trên thế giới, việc này giúp cho nó có thể tự tìm đường tối ưu để kết nối với host và tốc độ nhanh hơn mọi đối thủ.
Thứ 3, Chrome chạy song song rất nhiều process. Việc này giúp xử lý nhiều việc cùng lúc hơn là bị nghẽn ở việc đọc/ghi và chờ đợi. Chuyện này phải người trong nghề mới biết. Thực ra nó là nguyên nhân chính, nhưng nếu bạn chưa hiểu thì cứ bỏ qua.
Thứ 4, Chrome phân tích HTML, CSS, JS song song càng nhiều càng tốt. Về nguyên tắc, các thứ này cần phải làm theo trình tự, nhưng các kỹ sư đủ thông minh có thể tái cấu trúc để làm song song nhiều nhất có thể, cái nào cần đợi thì sẽ đợi, không cần đợi sẽ làm song song. Thuật ngữ trong ngành người ta hay gọi là multithreading và map-reduce.
Thứ 5, bộ core của Chrome là V8. Ai mà tìm hiểu sâu sẽ biết V8 có tốc độ xử lý rất khủng khiếp. Nguyên tắc của nó là dịch lại mã JS để có thể cùng xử lý một nhiệm vụ nhưng tốn ít bước hơn. Để giải thích dễ hiểu thì những dòng code mà dev viết thường là viết theo kiểu dễ đọc, dễ hiểu và dễ phát triển tiếp, nhưng nó không hẳn là tối ưu cho CPU xử lý. Công đoạn dịch lại để tương thích cao với mã máy là một thứ rất khó, nhưng V8 đã làm rất hiệu quả.
Cuối cùng (nhưng chưa phải tất cả), Internet Explorer với bộ core Trident đã phạm một lỗi thiết kế chết người: đó là cho phép CSS được can thiệp vào JS. Đại khái là CSS sẽ tối ưu khi chạy trên GPU, còn JS thì luôn phải chạy trên CPU. Việc cho phép CSS điều khiển JS sẽ dẫn tới tình trạng: JS cập nhật CSS, CSS cập nhật JS chỗ khác, JS lại cập nhật CSS chỗ khác nữa,... Điều này khiến IE không thể tối ưu bằng việc sử dụng GPU được, vì nếu dùng GPU sẽ dẫn tới tình trạng xử lý ở CPU một chút rồi GPU một chút,... và rất tệ.
Việc này đúng là cũng khó trách IE, vì thời đầu người ta không có chế ra GPU, lúc đó toàn là CPU cả nên IE không đến nổi tệ. Chỉ là sau này do nhu cầu của giới game thủ nên mới có GPU riêng, và kết quả khiến cấu trúc của IE trở nên lỗi thời, và bị lỗi nghiêm trọng.
Note: Tôi là một trong những người nghiên cứu về tối ưu tốc độ của ứng dụng canva.com, và vì thế tôi cũng tìm hiểu rất kỹ về vấn đề tối ưu của các trình duyệt.