tomcru/holy-loader

🎯 Thanh tiến trình đầu trang nhẹ cho React/Next.js

Holy Loader mang lại trải nghiệm mượt mà với thiết kế tối giản, phù hợp cho cả ứng dụng Next.js sử dụng app router hoặc pages router.

Holy Loader là một thành phần thanh tiến trình đầu trang nhẹ và có khả năng tùy biến cao, được thiết kế riêng cho các ứng dụng React và tối ưu hóa cho Next.js với app router. Dễ dàng tích hợp, hỗ trợ cấu hình động cho màu sắc, chiều cao, tốc độ, easing và nhiều hơn nữa. Đặc biệt, nó cung cấp điều khiển thủ công và hỗ trợ bố cục i18n (ltr/rtl).

✨ Điểm nổi bật

• Dễ tích hợp: Hỗ trợ mọi ứng dụng React, đặc biệt là Next.js với app router và pages router.
• Tùy biến cao: Cấu hình màu sắc, chiều cao, tốc độ, easing, z-index, box-shadow và nhiều thuộc tính khác.
• Hiệu ứng mượt mà: Sử dụng cài đặt tùy chỉnh để mang lại trải nghiệm tiến trình suôn sẻ và đẹp mắt.
• Điều khiển thủ công: Hỗ trợ bắt đầu và dừng thanh tiến trình thông qua startHolyLoader và stopHolyLoader.
• Hỗ trợ i18n: Tương thích với bố cục ltr (left-to-right) và rtl (right-to-left) thông qua prop dir.
• Quản lý URL thông minh: Tùy chọn bỏ qua tham số tìm kiếm khi kích hoạt bằng prop ignoreSearchParams.
• Hỗ trợ spinner: Tùy chọn hiển thị spinner xoay kèm thanh tiến trình bằng prop showSpinner.
• Z-index cao: Đảm bảo thanh tiến trình luôn hiển thị trên cùng với giá trị mặc định là 2147483647.

💡 Vì sao đáng chú ý

Khác biệt so với các giải pháp như NProgress, Holy Loader được thiết kế đặc biệt cho Next.js hiện đại, hỗ trợ cả app router và pages router. Với khả năng cấu hình linh hoạt và hỗ trợ bố cục đa ngôn ngữ, đây là lựa chọn lý tưởng cho các dự án React/Next.js cần thanh tiến trình tải đầu trang nhẹ nhàng nhưng mạnh mẽ. Dễ dàng tích hợp chỉ với một vài dòng code và hỗ trợ điều khiển thủ công cho các thao tác bất đồng bộ.

---

#TopLoader #NextJS #ProgressBar #React #i18n #TiniX