proto.lib

Render tiến độ với NDJSON streaming

Server ghi từng object JSON trên một dòng riêng (newline-delimited JSON) ngay khi tạo ra, client parse từng dòng khi nó tới và render dần thay vì chờ toàn bộ mảng hoàn tất; cần parser xử lý được dòng cuối bị cắt dở và một record lỗi in-band vì status code đã là 200 từ đầu.

ApplicationTrung bình2026-08-25
Render tiến độ với NDJSON streaming

Tags

#ndjson#streaming#incremental-render#chunked-response#partial-line

Tài liệu tham khảo

Mở rộng

Animation gốc là một file HTML tự chứa, có thể nhúng lại ở bất kỳ trang nào khác. Mở file gốc

Liên quan

ApplicationTrung bình

Server Components & Streaming Boundaries

Server Component chạy trên server, fetch dữ liệu và render ra kết quả tuần tự hoá, không đóng gói code vào bundle; chỉ phần được đánh dấu "use client" tại boundary mới có JS gửi xuống trình duyệt để hydrate, còn payload được stream về theo từng phần khi resolve xong.

#react-server-components#streaming#hydration#bundle-size
ApplicationNâng cao

Partial Prerendering: Shell tĩnh + Hole động

Một trang được chia làm phần shell tĩnh (layout, nav — không phụ thuộc user) prerender sẵn và phục vụ tức thì từ edge cache, và các HOLE động (nội dung cá nhân hoá) được stream lấp vào sau khi resolve — kết hợp tốc độ static với nội dung dynamic trên cùng một response.

#partial-prerendering#edge-cache#static-shell#streaming
ApplicationTrung bình

Resume SSE bằng Last-Event-ID

Mỗi event trong stream Server-Sent Events có thể mang một id; khi mất kết nối, trình duyệt tự reconnect và gửi header Last-Event-ID để server biết đã phát tới đâu và chỉ replay phần bị thiếu từ buffer, nếu buffer đó còn giữ.

#sse#reconnect#last-event-id#streaming