Directive Sync – Câu chuyện “dị” của Kit JS

Ý tưởng hình thành

Khi tôi bắt đầu phát triển Kit JS, tôi gặp một vấn đề khác — một thứ mà hầu hết các framework JS đều bỏ qua.

Trang web của tôi được render từ SSR (server-side rendering). Mọi thứ đã có sẵn trong HTML, SEO đã sẵn sàng. Nhưng khi tôi thử truyền lại state hoặc scope từ client vào những element đã được render đó, toàn bộ component bị re-render.
Và tôi nhận ra, tôi chỉ muốn đồng bộ lại dữ liệu, không phải vẽ lại thế giới.

Từ đó, Directive Sync ra đời.

Sync – một nhịp điệu khác của dữ liệu

Nếu model là cách framework truyền dữ liệu từ state ra view, thì sync là cách view nói ngược lại với state — một vòng khép kín mà không cần phá hủy hay dựng lại DOM.
Nói cách khác, sync không “làm lại”, nó nghe và ghi nhận.

Directive sync không sinh ra để ngược lại model, mà là sự kế thừa tự nhiên của nó trong bối cảnh SSR.
Nó tồn tại để giúp các trang được render sẵn từ server vẫn có thể hoạt động như một SPA nhẹ, nhưng không đánh mất giá trị SEO, tốc độ hay tính tĩnh của trang web.

Tại sao cần đến Sync?

Với các framework hiện nay, nếu bạn muốn có tính năng hai chiều (two-way binding), bạn phải để framework kiểm soát toàn bộ DOM.
Điều đó có nghĩa là khi HTML được render từ server, framework sẽ phải render lại lần nữa trên client để tạo ra binding.
Kết quả là:

• Bot SEO đọc được HTML thô nhưng không thấy trạng thái thật.
• Người dùng thấy một “nháy” khi trang re-render.
• Và bản thân ta phải chạy cả client lẫn server như hai thế giới tách biệt.

Sync giải quyết điều đó bằng cách tiêm ngược giá trị từ DOM đã render vào lại scope.
Không cần render lại, không cần diff DOM, chỉ đơn giản là đọc dữ liệu thật từ những gì server đã gửi — và giữ chúng nhất quán.

Triết lý đằng sau Kit JS và Directive Sync

Kit JS không được tạo ra để thay thế framework khác.
Nó sinh ra từ một nhu cầu rất cụ thể: kết nối lại giữa thế giới tĩnh và thế giới động, giữa SSR và reactive UI.
Đó không phải là một “ý tưởng framework mới”, mà là một tư duy ngược dòng:

Nếu dữ liệu đã ở đó, tại sao ta phải render lại?

Sync chính là sự biểu hiện của triết lý đó — đơn giản, thực tế và tôn trọng những gì đã có.
Nó không đòi làm chủ DOM, không buộc bạn phải “chạy lại” app, chỉ lặng lẽ đồng bộ để mọi thứ tiếp tục đúng như vốn dĩ.

Một mảnh nhỏ trong hành trình lớn

Kit JS, với tôi, không phải là cuộc đua framework.
Nó là một hành trình cá nhân để tìm lại sự tối giản trong cách ta viết web.
Directive Sync chỉ là một mảnh trong đó — một mảnh “dị” vì nó không chạy theo reactive thuần túy, mà hòa trộn giữa render tĩnh và sự sống động của dữ liệu.

Và có lẽ, chính trong sự “dị” đó, ta mới tìm thấy một hướng khác — nơi web vừa nhanh, vừa thật, và vẫn có linh hồn.

Link: kitjs.org