Giới thiệu

Trong thế giới phát triển web hiện đại, Svelte nổi lên như một trong những framework phổ biến nhờ vào sự đơn giản và hiệu suất cao của nó. Tuy nhiên, sự phát triển của Svelte không phải lúc nào cũng suôn sẻ. Bài viết này sẽ khám phá những thách thức mà Svelte đang gặp phải, đặc biệt là xung quanh khái niệm về Runes và Stores, cùng với những tiêu chuẩn mà chúng ta cần hướng tới.

Runes và Stores trong Svelte

Tại sao tôi yêu thích Stores?

Stores là một công cụ tuyệt vời để kiến trúc một trang web và đảm bảo rằng mọi thứ hoạt động mượt mà. Trong hơn một năm làm việc với một dự án Svelte khổng lồ, tôi nhận thấy rằng việc sử dụng Stores không đúng cách là một trong những vấn đề chính. Tại sao lại như vậy? Bởi vì mọi người vẫn đang suy nghĩ theo cách truyền thống, tức là coi giá trị là trung tâm thay vì các Observable.

Khi chúng ta xây dựng giao diện người dùng, việc làm việc với Stores yêu cầu chúng ta phải nghĩ rằng mọi thứ đều là một observable. Từ hành động của người dùng cho đến các cuộc gọi API, mọi thứ đều cần phải được xử lý như một observable.

Cách sử dụng Stores

Để làm điều này dễ dàng hơn, chúng ta chỉ cần xác định nơi cần giá trị và tránh việc chạm vào nó, mặc dù có thể sử dụng nó trong một component có thể khiến mọi thứ trở nên phức tạp. Tuy nhiên, một khi bạn đã làm điều này ở mọi phần, mọi thứ sẽ trở nên rõ ràng hơn.

Việc này giống như việc sử dụng RxJS trong NestJS. Cuối cùng, bạn có thể chỉ cần trả về một observable trong controller, do đó mọi thứ đều có thể được coi là một observable.

Tôi biết rằng có những trường hợp mà observable rất khó quản lý. Tuy nhiên, chúng ta vẫn có thể cách ly những trường hợp này bằng một giải pháp cụ thể và giữ tiêu chuẩn trong hệ thống, giúp việc xử lý trong tương lai trở nên dễ dàng hơn.

Quy tắc cơ bản về Observable

Quy tắc cơ bản khi làm việc với observable là không bao giờ subscribe một cách thủ công trừ khi bạn hoàn toàn chắc chắn về những gì đang làm và rằng bạn sẽ dọn dẹp mọi thứ sau đó. Nếu không, hãy xem xét liệu bạn có thể tránh việc subscribe và tìm một giải pháp khác.

Bên cạnh đó, tôi cũng bắt đầu sử dụng Stores như một trạng thái của component. Tôi tạo ra một loại controller chỉ để expose store và quản lý nó trong view. Điều này giúp cho mọi thứ trở nên đồng nhất, bên trong component và bên ngoài (toàn cục) đều sử dụng cùng một công cụ.

Một điều lớn mà tôi thích ở Svelte là RxJS tương thích mà không cần một thư viện bên ngoài. Observable thực sự là công dân hàng đầu trong Svelte, nhờ vào các Stores. Khi bạn đã làm việc với observable, việc sử dụng RxJS sẽ rất tuyệt vời vì nó có mọi thứ bạn cần cho việc này.

Runes: Vấn đề về tiêu chuẩn

Khi Runes xuất hiện, mọi tiêu chuẩn trong Svelte đã bị ảnh hưởng. Hãy để tôi thành thật, đây không phải là một vấn đề chỉ của Runes hay Svelte. Đây là vấn đề kế thừa do việc cần phải tương thích ngược với một sự thay đổi khổng lồ.

Điều tương tự đang xảy ra giữa signals và Observable trong Angular. Tuy nhiên, họ không cố gắng thay thế cái này bằng cái kia như Svelte đang làm với Runes.

Không có gì sai với điều đó. Chỉ là chúng ta có rất nhiều thư viện, một cộng đồng và một sự chuyển mình cần thiết. Tôi biết không có thư viện nào cần phải được viết lại, nhưng từ những người bên ngoài cộng đồng Svelte và cố gắng làm cho thư viện của họ hoạt động trong Svelte, họ sẽ muốn làm điều đó trong phiên bản mới nhất.

Sản phẩm, giám đốc, mọi người đều muốn được cập nhật lên phiên bản mới nhất. Điều này có thể chỉ là một quy tắc trong một hợp đồng hoặc một quyết định từ đội ngũ bảo mật. Một số quản lý cấp cao đưa ra các quyết định công nghệ chỉ dựa vào kết quả đầu tiên trên Google. Điều này làm phức tạp hóa việc có một mã nguồn chuẩn hóa trong một hệ sinh thái framework không chuẩn.

Cuối cùng, mọi người sẽ muốn được cập nhật lên phiên bản mới nhất của Svelte. Từ Runes đến các attachments, bao gồm cả slots. Tuy nhiên, điều này sẽ yêu cầu thay đổi trong mã nguồn, bất chấp việc mã nguồn mở.

Tôi yêu thích observable trong Svelte và muốn tiếp tục sử dụng framework này, vì nó cảm thấy tự nhiên và đơn giản. Tuy nhiên, điều này sẽ cần thời gian để chuyển sang kỷ nguyên mới này, và lướt qua những làn sóng không có tiêu chuẩn trong các mã nguồn của chúng ta.

Tôi biết đội ngũ Svelte đang làm một công việc tuyệt vời trong việc lướt qua làn sóng này và cố gắng làm rõ hướng đi của chúng ta.

Những gì tiếp theo

Tôi vẫn muốn tiếp tục lập trình trong Svelte, vì vậy tôi sẽ cố gắng bắt đầu giúp đỡ cộng đồng với 2 thư viện sẽ giúp tôi và những người khác chuẩn hóa dự án của họ.

Đặc biệt là trong các khía cạnh về observables và dịch vụ.

Dưới đây là một số dự án mà tôi đang làm việc:

• Apollo Graphql - Cuối cùng là sự trừu tượng đúng đắn cho Svelte
• RxJS cho Svelte 5 (Đang tiến hành)

Thực hành tốt nhất

• Sử dụng Stores một cách hợp lý: Hãy đảm bảo rằng bạn hiểu rõ cách thức hoạt động của Stores để không gặp phải những vấn đề sau này.
• Không subscribe một cách thủ công: Luôn luôn tìm cách để tránh việc subscribe trực tiếp.
• Lập kế hoạch: Trước khi bắt tay vào dự án, hãy lập kế hoạch rõ ràng về cách bạn sẽ sử dụng các công cụ như Stores và RxJS.

Cạm bẫy thường gặp

• Sử dụng Stores không đúng cách: Nhiều lập trình viên mới thường có xu hướng xem giá trị là trung tâm, điều này có thể gây khó khăn trong việc quản lý trạng thái.
• Thiếu hiểu biết về Observable: Những lập trình viên không quen thuộc với khái niệm này có thể gặp khó khăn trong việc làm việc với các API và dịch vụ.

Mẹo nâng cao hiệu suất

• Giảm thiểu số lượng subscribe: Cố gắng tối ưu hóa số lần bạn subscribe vào các observable để không làm giảm hiệu suất của ứng dụng.
• Sử dụng memoization: Nếu bạn có những giá trị mà không thay đổi thường xuyên, hãy xem xét việc lưu trữ chúng để không phải tính toán lại mỗi lần.

Giải quyết sự cố

• Nếu bạn gặp vấn đề với việc không hiển thị dữ liệu đúng cách: Kiểm tra các observable để đảm bảo rằng bạn đã subscribe đúng cách.
• Khi thấy hiệu suất kém: Sử dụng công cụ profiler để xác định các bottlenecks trong ứng dụng của bạn.

Kết luận

Svelte vẫn là một framework mạnh mẽ và đầy hứa hẹn, nhưng việc hiểu rõ các khái niệm như Runes và Stores là rất quan trọng để tận dụng tối đa tiềm năng của nó. Hãy tham gia vào cộng đồng Svelte để cùng nhau vượt qua những thách thức này và xây dựng những ứng dụng tuyệt vời. Nếu bạn có câu hỏi hoặc cần thêm thông tin, đừng ngần ngại liên hệ với tôi.