Lynx: Giải pháp mới cho ứng dụng đa nền tảng - JS Engine

Vì sao Lynx nhanh và nhấn mạnh đặc điểm không bị màn hình trắng (blank screen)? Định nghĩa NHANH ở đây có thể xem xét đến yếu tố hiệu năng, và yếu tố cảm giác phản hồi. Như ở bài trước tôi có đề cập tới con số 0.1s, nếu UI cập nhật dưới ngưỡng này thì cho ta cảm giác chung là hệ thống phản hồi ngay lập tức, ta có cảm giác nó nhanh, còn thực sự tác vụ tính toán đó đã hoàn thành hay chưa thì tạm chưa bàn đến. Lynx có cách tiếp cận hướng người dùng, nghĩa là nó đang hướng tới sự chiều chuộng khách hàng, cho người ta có cảm giác UI phản hồi ngay tức khắc. Để đáp ứng được hướng tiếp cận này thì đội ngũ Lynx đã chọn cách build PrimJS JS engine dựa trên QuickJS, đây một engine JS nhúng (embeddable Javascript engine) với các đặc điểm sau: Siêu nhẹ 210 KiB, nó không sử dụng bất kỳ depenency nào Sử dụng ngôn ngữ C Chiếm dụng cực ít tài nguyên RAM Thời gian khởi động rất nhanh Sử dụng trình dọn rác đơn giản QuickJS là một Intepreter JS engine, không hỗ trợ JIT (Just In Time) Đội ngũ thực hiện một số thay đổi trên PrimJS khiến nó tối ưu hơn QuickJS như: Tối ưu interpreter: hỗ trợ cache và cải thiện hiệu năng Tích hợp mô hình đối tượng liền mạch: các object của JS Engine tích hợp hiệu quả với Lynx Object, giảm thiểu trao đổi thông tin và nâng cao hiệu suất (để so sánh thì React Native old Arch từng bị nghẽn cổ chai khi thực hiện batching message qua bridge) Trình dọn rác nâng cao: phân tích bộ hiệu quả hơn, giảm thiểu rủi ro leak memory. (QuickJS nguyên bản chỉ đơn giản là tìm, đếm và dọn các reference) Hỗ trợ trình debug Chrome đầy đủ (Chrome DevTools Protocol) Vậy là Lynx được thừa hưởng toàn bộ các ưu điểm của QuickJS cộng thêm các tính năng custom riêng. Mặc dù QuickJS có nhiều ưu điểm nhưng để so sánh với Engine V8 thì cũng có những điểm chưa tốt bằng. Ví dụ như: V8 parse JSON (large object) hết đâu đó tầm ~50ms, trong khi QuickJS thì chậm hơn 2-3 lần. V8 loop 100M iteration trong ~100-150ms, còn QuickJS thì chậm hơn 3-4 lần. Tuy vậy, mỗi JS engine lại có ưu điểm riêng biệt khiến nó nổi trội hơn trong những use case cụ thể. Điển hình trong trường hợp này Lynx đánh đổi việc tối ưu thời gian khởi động cũng như giảm thiểu communicate giữa các object khiến nó trở nên hiệu quả, một hướng tiếp cận khá thông minh. Mình đang xây dựng Cộng đồng Lynx Vietnam tại: https://lynx-vietnam.dev, các bạn có ý kiến đóng góp hoặc yêu cầu gì xin vui lòng comment bên dưới. Mình rất trân quý và sẽ nỗ lực hết sức để giúp ích nhiều hơn cho cộng đồng. Chúc các bạn ngày mới làm việc hiệu quả. [edit]: Trong phần lớn trường hợp RN dùng Hermes Nếu Hermes bị disable thì nó sẽ chuyển qua dùng JSC (Javascript Core). Khi dùng Chrome debug thì code sẽ thực thi trên Chrome vốn sử dụng V8

Mar 13, 2025 - 03:57

Lynx: Giải pháp mới cho ứng dụng đa nền tảng - JS Engine

Vì sao Lynx nhanh và nhấn mạnh đặc điểm không bị màn hình trắng (blank screen)?

Định nghĩa NHANH ở đây có thể xem xét đến yếu tố hiệu năng, và yếu tố cảm giác phản hồi.

Như ở bài trước tôi có đề cập tới con số 0.1s, nếu UI cập nhật dưới ngưỡng này thì cho ta cảm giác chung là hệ thống phản hồi ngay lập tức, ta có cảm giác nó nhanh, còn thực sự tác vụ tính toán đó đã hoàn thành hay chưa thì tạm chưa bàn đến.

Lynx có cách tiếp cận hướng người dùng, nghĩa là nó đang hướng tới sự chiều chuộng khách hàng, cho người ta có cảm giác UI phản hồi ngay tức khắc.

Để đáp ứng được hướng tiếp cận này thì đội ngũ Lynx đã chọn cách build PrimJS JS engine dựa trên QuickJS, đây một engine JS nhúng (embeddable Javascript engine) với các đặc điểm sau:

Siêu nhẹ 210 KiB, nó không sử dụng bất kỳ depenency nào
Sử dụng ngôn ngữ C
Chiếm dụng cực ít tài nguyên RAM
Thời gian khởi động rất nhanh
Sử dụng trình dọn rác đơn giản
QuickJS là một Intepreter JS engine, không hỗ trợ JIT (Just In Time)

Đội ngũ thực hiện một số thay đổi trên PrimJS khiến nó tối ưu hơn QuickJS như:

Tối ưu interpreter: hỗ trợ cache và cải thiện hiệu năng
Tích hợp mô hình đối tượng liền mạch: các object của JS Engine tích hợp hiệu quả với Lynx Object, giảm thiểu trao đổi thông tin và nâng cao hiệu suất (để so sánh thì React Native old Arch từng bị nghẽn cổ chai khi thực hiện batching message qua bridge)
Trình dọn rác nâng cao: phân tích bộ hiệu quả hơn, giảm thiểu rủi ro leak memory. (QuickJS nguyên bản chỉ đơn giản là tìm, đếm và dọn các reference)
Hỗ trợ trình debug Chrome đầy đủ (Chrome DevTools Protocol)

Vậy là Lynx được thừa hưởng toàn bộ các ưu điểm của QuickJS cộng thêm các tính năng custom riêng.

Mặc dù QuickJS có nhiều ưu điểm nhưng để so sánh với Engine V8 thì cũng có những điểm chưa tốt bằng.

Ví dụ như:

V8 parse JSON (large object) hết đâu đó tầm ~50ms, trong khi QuickJS thì chậm hơn 2-3 lần.
V8 loop 100M iteration trong ~100-150ms, còn QuickJS thì chậm hơn 3-4 lần.

Tuy vậy, mỗi JS engine lại có ưu điểm riêng biệt khiến nó nổi trội hơn trong những use case cụ thể.

Điển hình trong trường hợp này Lynx đánh đổi việc tối ưu thời gian khởi động cũng như giảm thiểu communicate giữa các object khiến nó trở nên hiệu quả, một hướng tiếp cận khá thông minh.

Mình đang xây dựng Cộng đồng Lynx Vietnam tại: https://lynx-vietnam.dev, các bạn có ý kiến đóng góp hoặc yêu cầu gì xin vui lòng comment bên dưới. Mình rất trân quý và sẽ nỗ lực hết sức để giúp ích nhiều hơn cho cộng đồng.

Chúc các bạn ngày mới làm việc hiệu quả.

[edit]:

Trong phần lớn trường hợp RN dùng Hermes
Nếu Hermes bị disable thì nó sẽ chuyển qua dùng JSC (Javascript Core).
Khi dùng Chrome debug thì code sẽ thực thi trên Chrome vốn sử dụng V8