proto.lib

Đưa app state vào URL để deep-link

Filter, tab, phân trang và item đang chọn được mã hoá vào query string hoặc hash thay vì chỉ giữ trong memory, nhờ đó back/forward, reload và chia sẻ link đều hoạt động đúng; trạng thái UI thoáng qua như hover hay form đang gõ dở thì không nên đưa vào URL.

ApplicationCơ bản2026-08-25
Đưa app state vào URL để deep-link

Tags

#url-state#deep-link#history-api#query-string#replacestate

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

Navigation API: điều hướng SPA thay History API

Navigation API cho SPA đăng ký intercept() để nhận toàn bộ điều hướng — link click, back/forward, submit form — commit khi dữ liệu đã sẵn sàng, giữ scroll và trạng thái focus, đồng thời báo lỗi điều hướng thất bại đúng cách thay vì im lặng.

#navigation-api#spa#routing#history-api
ApplicationTrung bình

Callback OAuth trong SPA: khôi phục route sau đăng nhập

Trước khi chuyển hướng sang identity provider, SPA lưu tham số state cùng route đích vào storage; khi provider redirect về callback, ứng dụng đối chiếu state, đổi code lấy token rồi điều hướng lại đúng route ban đầu — không phải trang chủ.

#oauth#spa#callback#state-param
ApplicationTrung bình

Web Locks API: nhiều tab phối hợp không tranh việc

Web Locks API cho phép nhiều tab của cùng một app xin cùng một khoá tên; chỉ một tab giữ được lock chạy việc như sync dữ liệu hay refresh token, các tab khác chờ hoặc bỏ qua tuỳ chế độ, và lock tự động nhả khi tab đóng hay reload — khác cờ localStorage vốn không tự dọn khi tab crash.

#web-locks#navigator-locks#multi-tab#token-refresh