🔍 Deep Dive · Beginner

Widget Previews đã stable: sửa UI không cần chạy cả app

Chạy cả app chỉ để sửa một nút rất chậm. Widget Preview render widget riêng lẻ cách ly. Sau các bản experimental, nó stable trong Flutter 3.47.

Sơ đồ: Widget Previews Stable

Stable nghĩa là gì

  • Khởi động nhanh nhờ cache local .widget_preview/.
  • PreviewThemeData để layer theme tuần tự (ma trận test theo seed/contrast).
  • Tự đồng bộ asset web/ khi preview widget web.

Workflow đáng tiền

  1. Tách widget đang sửa thành class preview được.
  2. Thêm preview cho mặc định / dark / chữ to / data rỗng.
  3. Lặp tới khi preview nhàm chán — rồi mới ghép vào app.

Đây cũng là vòng nhanh nhất cho design-system trên material_ui / catalog tùy chỉnh.

Cạm bẫy

  • Preview đụng dart:io hoặc platform channel sẽ không chạy — giữ UI thuần.
  • Đừng nhét business logic vào preview; chỉ fixture.
#Flutter#DevTools#WidgetPreview#DX