hybridsjs/hybrids

🧩 Hybrids — Framework JavaScript với kiến trúc khai báo + hàm thuần

Hybrids sử dụng đối tượng thuần và hàm thuần làm nền tảng, vẫn chạy trên Web Components API — không có lớp, không constructor, chỉ có plain objects.

Hybrids là một JavaScript framework cho xây dựng ứng dụng web client, thư viện UI component, hoặc single web component. Điểm đặc biệt nằm ở sự kết hợp giữa mô hình khai báo (declarative) và hàm thuần (pure functions), giúp component dễ hiểu, dễ test và dễ bảo trì.

✨ Điểm nổi bật

• Component Model: Mỗi component là một plain object với các thuộc tính đơn giản, render bằng hàm thuần — không có class hay lifecycle hooks phức tạp.
• Global State Management: Hỗ trợ store bên ngoài với async fetching, offline caching, relations — tích hợp sẵn mà không cần thư viện phụ.
• App-like Routing: Router dựa trên cây cấu trúc view (graph), không chỉ match URL — hỗ trợ dialog, protected view, routing tùy chọn.
• Layout Engine: Viết CSS layout trực tiếp trong template bằng thuộc tính layout, không cần Shadow DOM vẫn giữ được encapsulation.
• Localization: Tự động dịch nội dung template, hỗ trợ plural form, HTML trong message, kèm CLI tool để extract message từ source code.
• Hot Module Replacement: Hỗ trợ HMR mà không cần cấu hình thêm.

💡 Vì sao đáng chú ý

Hybrids loại bỏ hoàn toàn lớp (class) và constructor — thay vào đó dùng plain object kết hợp pure function để định nghĩa component. Điều này giúp giảm thiểu boilerplate và làm cho logic component trở nên rõ ràng, dễ suy luận. Store management với async support, offline caching và relations được tích hợp sẵn, nghĩa là không cần thêm Redux hay MobX cho các dự án quy mô vừa.

Router của Hybrids tiếp cận theo hướng đồ thị view thay vì chỉ match URL đơn thuần, giúp việc quản lý navigation phức tạp (dialog, protected route) trở nên tự nhiên hơn. Layout Engine cho phép viết CSS layout ngay trong template HTML template literal — rút ngắn đáng kể thời gian phát triển giao diện.

#JavaScript #WebComponents #Framework #StateManagement #TiniX