Bạn có thích ứng dụng nền web chạy nhanh hơn, mượt hơn không?

WebAssembly (viết tắt: wasm) là một loại mã mới sẽ được dùng để viết ra các thành phần quan trọng của trang web hoặc ứng dụng nền web trong tương lai. Wasm do một hiệp hội bao gồm Google, Microsoft, Mozilla, nhóm phát triển WebKit (với sự tham gia của Adobe, Apple, Samsung…) và nhiều tập thể khác cùng phát triển.

Một khi wasm đã được tích hợp vào mọi trình duyệt phổ biến, nó sẽ mang lại nhiều lợi ích to lớn: hiệu quả thực thi tốt hơn JavaScript, rút ngắn thời gian chờ tải trang và nhiều thứ khác. Trong bài viết này mình sẽ giới thiệu đến các bạn về wasm cũng như lợi ích thực tế của nó.

1. JavaScript và những hạn chế

Có thể bạn đã nghe nhiều về HTML5 và CSS. Đây là là hai loại “ngôn ngữ” được dùng để xây dựng bố cục và giao diện cho trang web, chính là các nút bấm, menu hay những dòng chữ mà bạn thấy. Còn với JavaScript, nó là một ngôn ngữ lập trình dùng cho web để khi bạn tương tác với web thì nó biết cách phản hồi lại cho phù hợp.

Lấy ví dụ đơn giản như sau: lập trình viên muốn rằng khi bạn nhấn vào một nút trên website của anh ta, một thông báo sẽ nhảy lên với dòng chữ “Xin chào anh đẹp trai“. Để làm được điều này, anh ta sẽ phải viết một đoạn mã nguồn bằng JavaScript và nhúng vào trang web của mình.

Giờ chúng ta nói đến trình duyệt. Làm thế nào trình duyệt biết đoạn JavaScript đó có ý nghĩa như thế nào để mà hiển thị thông báo như trong ví dụ ở trên? Đó là bởi vì trong trình duyệt có sẵn một bộ nguồn biên dịch JavaScript, gọi là JavaScript engine. Chrome, Firefox, Safari hay Internet Explorer đều có bộ nguồn của riêng mình, và chúng đều hoạt động theo cách như sau:

wasm2

Như bạn thấy, để một đoạn mã JavaScript chạy được thì phải trải đến 4 giai đoạn, khá tốn thời gian và hiệu năng cũng không cao. Bằng chứng rõ ràng đó là các web app thường không nhanh bằng web được viết cho chính hệ điều hành (native app), và hiệu năng có thể thấp hơn đến 3 lần.

Để giải quyết bài toán trên, Mozilla cách đây vài năm đã đưa ra dự án asm.js. Theo đó lập trình viên khi làm web sẽ viết JavaScript theo một cách đặc biệt để engine có thể tạo ra mã máy một cách hiệu quả nhất có thể. Nói nôm na là Mozilla đang cố gắng vượt qua được bước biên dịch đầu tiên và kết quả đạt được khá ấn tượng: tốc độ thực thi có thể tăng lên đến 70% so với bình thường.

Google cũng có một dự án của riêng mình với tên gọi Native Client nhằm giải quyết vấn đề tương tự nhằm mục tiêu đưa hiệu năng của web app tiến gần hơn với native app, tuy nhiên nó lại không thật sự phổ biến. Và đó là một trong những lý do mà các “ông lớn” quyết định bắt tay nhau để làm ra một thứ gì đó tốt hơn.

2. WebAssembly: bước kế tiếp của asm.js

Hiện tại, WebAssembly có thể được xem như mã nguồn asm.js nhưng được viết lại ở dạng nhị phân (binary). Thứ gọi là bytecode mà các bạn thấy ở sơ đồ bên trên chính là một loại mã binary đặc biệt. Và tập tin chứa những dòng mã binary này sẽ có đuôi là *.wasm.

Ví dụ từ mã nguồn biên dịch thành bytecode của Java. Từ mã nguồn muốn thành bytecode thì phải qua bước biên dịch (compile)
Ví dụ từ mã nguồn biên dịch thành bytecode của Java. Từ mã nguồn muốn thành bytecode thì phải qua bước biên dịch (compile)

Có những lợi ích như sau khi sử dụng binary code nói riêng và WebAssembly nói chung:

  • Thời gian tải nhanh hơn: do đã nằm sẵn ở dạng bytecode, WebAssembly sẽ được dịch sang mã máy để thực thi trong thời gian ngắn hơn bởi engine sẽ giảm tải công việc của nó, nhất là trên thiết bị di động
  • Hiệu năng phần mềm nền web tốt hơn, nhất là những thứ có liên quan đến đồ họa, tính toán nặng, nén dữ liệu, thao tác số học…
  • Khắc phục những hạn chế còn tồn tại của JavaScript nguyên thủy lẫn asm.js
  • Cho phép cải tiến WebAssembly trong tương lai một cách đơn giản
  • Khi trình duyệt đã hỗ trợ đầy đủ cho wasm (có nói ở ngay đoạn bên dưới), wasm có thể tách khỏi JavaScript mà không làm tổn hại hay mất an toàn cho phần mềm
  • Hỗ trợ dịch từ C/C++ và nhiều ngôn ngữ lập trình khác sang thẳng WebAssembly để việc phát triển web app được dễ dàng hơn (hiện nếu app viết bằng C/C++ muốn chạy trên web phải dịch qua JavaScript rồi lại qua nhiều bước dịch khác nữa như đã mô tả ở phần 1)

Để sử dụng được WebAssembly, các hãng như Microsoft, Apple, Google, Mozilla sẽ phải nâng cấp engine trong các trình duyệt của họ hoặc ra mắt một engine mới. Còn hiện tại các JavaScript engine sẽ thực thi wasm bằng cách thông qua một thư viện trung gian giúp phiên dịch WebAssembly thành asm.js (tức là dịch thành JavaScript) để đảm bảo tính tương thích ngược. Và điều này vẫn nhanh hơn so với phương pháp xài JavaScript thuần túy.

Nhưng việc dịch wasm sang asm.js (hay nói cách khác, dịch từ wasm sang JavaScript) chỉ là tạm thời nhằm đảm bảo tính tương thích mà thôi. Sắp tới, wasm sẽ dần tách ra theo một hướng đi riêng, đó là thời điểm mà các engine mới cho wasm đã được triển khai đầy đủ vào các trình duyệt phổ biến.

Nói về “sản phẩm” thực tế, những nỗ lực đầu tiên để triển khai WebAssembly đã được tiến hành: một tập tin nén định dạng binary của WebAssembly có kích thước nhỏ hơn 20-30% so với cùng loại tập tin đó nhưng chứ mã asm.js, từ đó rút ngắn thời gian download code trước khi chạy. Ngoài ra, việc giải mã wasm nhanh hơn 23 lần so với cùng tác vụ đó nhưng sử dụng cho mã asm.js nguyên gốc.

Tất nhiên, việc viết WebAssembly mà ở dạng binary thì quá khó khăn cho lập trình, do đó sẽ có một cách riêng để viết WebAssembly theo dạng văn bản thông thường. Cách này thì đến giờ vẫn chưa được phát minh do Hiệp hội WebAssembly còn đang trong giai đoạn phát triển ban đầu, mới thứ hầu như chỉ mới ở giai đoạn nguyên mẫu.

3. WebAssembly không thay thế JavaScript trong ngắn hạn

Đây là điều mà chúng ta cần nhận thức rõ, và chính nhóm phát triển WebAssembly cũng đã khẳng định như thế, ít nhất là trong ngắn hạn. Vậy thì JavaScript và WebAssembly có thể cùng tồn tại ra sao?

Với những tính năng đơn giản, như việc nhấp chuột vào nút và hiện thông báo “Xin chào anh đẹp trai“, người ta sẽ tiếp tục dùng JavaScript vì công việc sẽ dễ dàng, đơn giản hơn. Tương tự, những tương tác giao diện đơn giản thì vẫn xài JavaScript. Còn những thành phần nặng của trang web, ví dụ như chức năng chơi game, giải mã, chỉnh sửa hình ảnh, video… thì sẽ được triển khai bằng WebAssembly (lập trình viên có thể tự viết tay mã binary hoặc sử dụng một ngôn ngữ dạng văn bản nào đó chưa được phát minh). Tất nhiên, một ứng dụng web cũng hoàn toàn có thể được viết chỉ bằng WebAssembly.

Ngoài ra, những đoạn mã viết bên ngoài, đặc biệt là C/C++, cũng sẽ dễ dàng được chuyển sang tích hợp trong web thông qua WebAssembly. Đồng nghĩa với việc có khả năng đến một lúc nào đó trong tương lai, chúng ta có thể chạy Adobe Premier một cách mượt mà trên web để dựng phim, chơi các game cao cấp ngay trong trình duyệt, hoặc sử dụng các app nền web khác với hiệu năng không khác mấy so với app native.

4. Tương lai xa

Hiện tại, trọng tâm của nhóm WebAssembly là xây dựng công cụ để biên dịch các chương trình C/C++ và cho phép có thể chạy được trên nền web, về sau thì có thể hỗ trợ thêm bất kì ngôn ngữ cấp cao nào khác, ví dụ như C#, Go, Rust… và cũng hoạt động với bất kì kiến trúc vi xử lý nào. Các đơn vị chịu trách nhiệm phát triển WebAssembly cũng sẽ làm ra những công cụ khác nhau để giúp lập trình viên gỡ lỗi nhanh chóng, thuận tiện hơn.

Cụ thể hơn, lộ trình phát triển WebAssembly có thể chia thành 3 giai đoạn như sau:

  1. Một sản phẩm tối thiểu nhất có thể dùng được với nhiều điểm tương tự asm.js, ngôn ngữ nguồn (để dịch từ đó sang wasm) được hỗ trợ chủ yếu là C/C++ <= chúng ta đang ở những bước đầu của giai đoạn này
  2. Các tính năng nâng cao, ví dụ như phân luồng tính toán, xử lý lỗi… sẽ được bổ sung thêm, và vẫn tập trung hỗ trợ ngôn ngữ nguồn là C/C++
  3. Hỗ trợ thêm cho các ngôn ngữ nguồn khác, cho phép WebAssembly truy cập vào các thành phần mà trước đây chỉ dùng được bằng JavaScript, các hàm API tăng cường, tối ưu hóa,…

So với những dự án khác, khả năng thành công của WebAssembly cao hơn bởi vì 3 lý do chính:

  • Đầu tiên, đây là nỗ lực của cả một tập thể những công ty lớn, trong đó có đủ hết các dự án trình duyệt to như Firefox, Chromium, Edge và WebKit.
  • Thứ hai, việc WebAssembly có thể cùng hoạt động với JavaScript là rất tuyệt vời. Khi đó, lập trình viên có thể viết JavaScript có thể import các thành phần của WebAssembly và sử dụng.
  • Thứ ba, người ta có thể biên dịch rất nhiều ngôn ngữ khác nhau ra wasm, khi đó việc lập trình web sẽ trở nên phổ biến và dễ dàng hơn nữa.

5. Kết

Hiện WebAssembly vẫn còn ở giai đoạn rất sơ khai, người ta chỉ mới nghĩ về nó và phác họa ra những nguyên mẫu code đầu tiên mà thôi. Nó chưa có cấu hình hoàn chỉnh, thậm chí cấu hình nháp còn chưa có nữa. Tuy nhiên, những hứa hẹn của WebAssembly liên quan đến thời gian tải hay hiệu năng thì rất hấp dẫn. Và với sự chung tay phát triển của nhiều tên tuổi lớn trong làng công nghệ, chúng ta có thể kỳ vọng ngày WebAssembly được tung ra chính thức sẽ không quá xa và lúc đó sẽ có những ứng dụng nền web chạy ngon gần giống như app native.

Theo Tinh Tế

Posted in Tin tức

Leave a Comment

Your email address will not be published. Required fields are marked *

*
*