Rendering là gì?

Rendering là một quá trình được sử dụng trong phát triển web (web development) để code của website thành các trang web tương tác mà người dùng nhìn thấy khi họ truy cập một website. Thuật ngữ này thường đề cập đến việc sử dụng code HTML, CSS và JavaScript. Quá trình này được hoàn thành bởi rendering engine, phần mềm được trình duyệt web sử dụng để render một trang web.

Trình duyệt web render các trang web theo trình tự sau:

• Trong khi tải một trang web, máy chủ web (web server) sẽ gửi một thư mục các file chứa code HTML, CSS và JavaScript tới trình duyệt web của người dùng.
• Rendering engine chuyển đổi dữ liệu này (byte) thành các ký tự (code HTML).
• Nó parse các ký tự thành các token, các token này được tiếp tục parse thành các nút (node).
• Rendering engine liên kết các nút thành một cấu trúc dạng cây (tree-like structure) được gọi là DOM.
• Đồng thời, trình duyệt chuyển đổi code CSS thành CSSOM thông qua một quá trình tương tự.
• Rendering engine kết hợp DOM và CSSOM để tạo ra một cấu trúc dạng cây được gọi là render tree. Render tree chứa thông tin style và nội dung mà trình duyệt cần đưa vào một trang web để người xem xem, tính toán layout cho từng phần tử hiển thị (visible element ) của trang web và vẽ chúng trên màn hình để người dùng cuối xem.
• Thao tác layout là bước tiếp theo. Sử dụng render tree, rendering engine sẽ tính toán vị trí của mỗi phần tử hiển thị của một trang web.
• Cuối cùng, rendering engine thêm hoặc vẽ các phần tử trên màn hình để người dùng cuối xem. Trang web hiện đã được render.