Micro-frontendTách biệt lỗi bằng cách bọc mỗi micro-frontend trong một error boundary và nạp/khởi tạo nó độc lập, để khi một mảnh crash thì chỉ hiện fallback của riêng nó, các mảnh khác vẫn chạy.
- Cụ thể: shell bọc mỗi mảnh trong React error boundary, hoặc try/catch khi mount (single-spa có
unmountErrorHandlervà timeouts); nếuremoteEntry.jsload fail hoặc timeout thì hiện placeholder thay vì để lỗi cả trang. iframe cho tách biệt runtime mạnh nhất nhưng đánh đổi UX. - Lưu ý: thiếu error boundary thì chỉ một remote lỗi/timeout có thể làm sập toàn bộ shell — luôn thiết kế fallback cho từng mảnh và đặt timeout cho việc load remote.
Isolate failures by wrapping each micro-frontend in an error boundary and loading/initializing it independently, so when one piece crashes it shows only its own fallback while the others keep working.
- Concretely: the shell wraps each piece in a React error boundary, or try/catches at mount (single-spa has
unmountErrorHandlerand timeouts); ifremoteEntry.jsfails to load or times out, show a placeholder instead of letting the page break. - Iframes give the strongest runtime isolation but at a UX cost.
- Note: without error boundaries, a single failing/timing-out remote can take down the entire shell — always design a per-piece fallback and set a timeout on remote loading.