13

Cùng dự đoán xu hướng công nghệ Web trong năm 5 năm nữa (2020 - 2025)

Công nghệ luôn thay đổi tiến hoá theo thời gian, việc chạy bạn chạy đua với công nghệ  là một cái gì đó không có điểm kết thúc. Hãy chọn cho mình một stack có ý nghĩa với bản thân bạn, tạo bệ phóng để phát triển.

Tại sao mình lại nói có ý nghĩa, ý nghĩa ở đây là về mặt kinh tế, có thể nuôi sống được bản thận, phù hợp với định hướng phát triển bản thân. Khi mà bạn chọn một stack phù hợp, bạn sẽ dùng nó rất nhiều trong công việc hằng ngày, qua đó trau dồi kĩ năng lập trình, kĩ năng giải quyết vấn đề của mình, không đơn giản là bạn chỉ làm quen và code được.

Ngoài ra việc tiên đoán trước sự phát triển của công nghệ sẽ giúp bạn có định hướng đúng hơn trong sự nghiệp của bạn. Dù sao bạn tiên đoán dựa trên những cơ sở nào đó vẫn an toàn hơn là bạn chạy theo công nghệ một cách mù quáng.

✧ ✧ ✧

Typescript

typescripttypescript

Khi mà việc phát triển một ứng dụng SPA bằng javascript bây giờ đã quá dễ dàng khi mà ngoài kia có cả tá framework, lib như  Angular, React, Vue, Svelte...

Cũng giống như tháp nhu cầu của con người, khi mà việc ăn uống đã ấm no đầy đủ, thì nhu cầu ở mức cao hơn đó là nhu cầu an toàn.

tháp nhu cầu maslowtháp nhu cầu maslow

Trong phần mềm cũng vậy, khi mà việc phát triển ứng dụng bằng javascript bây giờ đã quá dễ dàng rồi, thì việc sử dụng typescript để ứng dụng của chúng ta an toàn hơn cũng là điều hiển nhiên.

Javascript là dynamic type, khi bạn tạo ra một biến hay một object thì javascript sẽ không ràng buộc về mặt kiểu dữ liệu, đồng nghĩa với việc là bạn có thể sử dụng một biến là number như một object là điều bình thường, khi bạn compile code javascript cũng chẳng la lên đâu, bạn chỉ phát hiện ra khi mà ứng dụng của bạn được chạy live thôi.

Typescript cung cấp những configs, rule, những ràng buộc về mặt dữ liệu  để trong quá trình bạn compile code từ typescript => javascript nó sẽ quăng trong lúc bạn compile, hoặc là bạn trong lúc bạn code nó sẽ báo trong IDE của bạn luôn rồi.

Ở đây mình dùng từ CUNG CẤP nha, tại vì bạn có thể xài hoặc không xài những lợi ích này. Điển hình trong trường hợp :

Vì bạn sử dụng any nên typescript compile sẽ không báo lỗi ở đây.

Hầu hết những framework đã support typescript rồi, việc bạn bắt đầu typescript bây giờ cũng sẽ giảm nỗi đau của việc fix bugs không mong muốn, ứng dụng của bạn sẽ an toàn hơn.

WebAssembly

Từ trước đến nay, nền tảng web app chỉ có 2 phần:

  • Virtual Machine (VM) để chạy code của dứng dụng web => JavaScript
  • Cung cấp các Web APIs ( DOM, CSSDOM, WebGL ...) để có thể tương tác với các thành phần của ứng dụng chạy trên browser. 

Nếu chỉ dừng lại ở việc xây dựng những ứng dụng web để hiển thị thông tin, các sản phẩm, update/insert thao tác trên DOM thì nền tảng web như trên đã giải quyết tốt vấn đề hiện tại rồi.

 Mình thử đặt ra 3 kì vọng về công nghệ web có thể làm tốt được:

  •  Công nghệ web giờ đã có mặt trên tất cả các thiết bị từ mobile , tablet cho bến desktop, việc chỉ cần build một ứng dụng web là có thể sử dụng được trên tất cả các device/OS. (Để thay thế thực sự rất khó, trừ khi ứng dụng web của bạn mang lại performance thực sự cao như cài một app trên thiết bị đó)
  • Javascript không thể nào chạy mượt mà được những tác vụ nặng như xử lý video, games, computer vision ... Bây giờ mà có thể cài dota2 chơi trên web được luôn thì ngon nhỉ.
  • Tính di động của nền tảng web, bây giờ mà có thể code được trên web mà trải nghiệm code như thông thường trước đây, mà không bị phụ thuộc vào bất kì OS nào thì quá phê luôn. 
✧ ✧ ✧

Với WebAssembly thì những kì vọng trên mình nghĩ là có thể thành hiện thực, Wasm (WebAssembly) là một tập hợp byte code nhị phân mà máy tính có thể thực thi được gần ngang với tốc độ thực thi native-code. Nhờ vậy sẽ đẩy ứng dụng web lên một tầm ứng dụng khác rộng hơn.

Native code is computer programming (code) that is compiled to run with a particular processor (such as an Intel x86-class processor) and its set of instructions. (what is native code)

Giờ đây virtual machine có thể đọc wasm code thông qua WebAssemby APIs. Wasm APIs wrap wasm code lại và cho phép javascript có thể gọi những function được viết bằng wasm, qua đó mở rộng khả năng phát triển ứng dụng trên nền tảng web.

Thực tế wasm đã được ứng dụng, những sản phầm đã sử dụng wasm như Google Earth, Figma.

Vậy trong tương lại WebAssemby sẽ thay thế javascript?

Trước khi trả lời thì các bạn cần nắm rõ 2 quan điểm sau:

  • Javascript là hight-level language, có thể dễ dàng phát triển một ứng dụng web với javascript dựa vào hệ sinh thái của nó: dynamic type, frameworks, library, no compile step....
  • Wasm là low-level language, wasm có tốc độ thực thi gần ngang với tốc độ native-code, qua đó sử dụng wasm có thể xây dụng những ứng dụng xử lý hình ảnh như photoshop, edit video như adobe premiere, phát triển game 3D... nhưng chạy trên nền tảng web.

Trong tương lai Wasm có thể sẽ được phát triển và sử dụng nhiều hơn nhưng nó sẽ không thay thế javascript. WebAssemby là để cộng sinh với javascript, để bổ sung những tính năng mà javascript không thể làm một cách mượt mà được.

Compile to JS

Kể từ khi Nodejs ra đời, Nodejs đã đẩy mạnh hệ sinh thái javascript phát triển cực kì mạnh, JavaScript giờ đây có thể code từ Frontend tới Backend.

https://github.com/jashkenas/coffeescript/wiki/List-of-languages-that-compile-to-JShttps://github.com/jashkenas/coffeescript/wiki/List-of-languages-that-compile-to-JS

Đặc trưng của JavaScript là dynamic type, no compile step, hầu như bugs của javascript phải chạy code mới phát hiện được. Bạn có thể code javascript an toàn được, nhưng cuối cùng bạn chỉ có thể kiểm chứng khi code được chạy lên thôi, vì javascript chạy trực tiếp trên browser mà không cần compile. Chưa kể việc việc kiểm tra phải xử lý bằng logic.

✧ ✧ ✧

Chạy Javascript an toàn và sử dụng được hệ sinh thái javascript ?

Complie-To-JS here to help. Typescript, Elm, Dart,  ClojureScript ... là những ngôn ngữ cấp cao, khi bạn lập trình trên ngôn ngữ này sẽ có một tập các rules và logic của mỗi ngôn ngữ, để bạn có thể code an toàn hơn,  dễ thiết kế triến trúc ứng dụng hơn.

Code trên những ngôn ngữ cấp cao này sẽ chạy qua một compiler để build ra được code javascript có thể chạy trên browser. Quá trình build như thế nào thì những ngôn ngữ đó tự quyết định, việc có thêm một bước compiler như vậy thì lỗi (syntax, miss match variable, ....) phát hiện trong lúc compiler, tối ưu javascript code để chạy trên browser.

✧ ✧ ✧

Mình nghĩ trong 5 năm nữa những ngôn ngữ Compile-To-JS sẽ phát triển mạnh và trưởng thành, qua đó những framework/libs như React/Angular/Vue/Svelte ... có thể sẽ support những ngôn ngữ cấp cao này.

Flutter

Flutter là một SDK phát triển ứng dụng di động mã nguồn mở được tạo ra và phát triển bởi Google, phiên bản đầu tiên phát hành vào ngày 4/1/2018, cho đến này.

Cho đến nay starts của flutter trên github đã gần bằng với react-native dù release trễ tới 3 năm.

github startgithub start

Còn đây là trending của google:

https://trends.google.com/trends/explore?geo=US&q=react-native,flutterhttps://trends.google.com/trends/explore?geo=US&q=react-native,flutter

Vậy đâu là lý do khiến flutter hot đến vậy?

Multiple platform release

Chỉ cần xây dụng một team dev flutter, codebase có thể build ra ứng dụng ios và android.

Được sử dụng bởi những công ty lớn

Google, Alibaba, Capital One, Tencent ... đã tin tưởng và sử dụng flutter để phát triển ứng dụng.

companies use fluttercompanies use flutter

Tài liệu xịn xò

Điều này cực kì quan trọng với những người mới, việc tài liệu tổ chức thông mình và đầy đủ sẽ rút ngắn thời gian của người học xuống rất nhiều. Khi mình tìm hiểu và viết bài viết này về flutter, đa số có những phản hồi tốt về tài liệu của flutter.

Không những hướng dẫn về text, còn có hướng dẫn về videos, code  samples.

Flutter Engine

Không giống React native, flutter không sử dụng OEM widgets hay WebView để  dựng những thành phần của ứng dụng. Thay vào đó flutter xây dựng một con rendering engine để render các widgets (what make flutter unique) .

Flutter cung cấp một bộ các widgets cơ bản nhất để bạn có thể sử dụng độc lập hoặc customize bằng cách composite lại những widgets cơ bản.

Productive development

flutter cung cấp stateful hot-load, có nghĩa là trong quá trình dev bạn không cần phải reload lại để apply code mới, hot-reload sẽ giữ trạng thái data của widgets mà vẫn apply code mới được.

Supported  by Android Studio and VS Code

Vậy thì khỏi lo lắng tìm hiểu xem IDEs nào phù hợp với flutter rồi nhé !

Kết bài

Công nghệ mới sinh ra cũng chỉ giải quyết những nhược điểm, hạn chế của cái cũ. Suy cho cùng bản chất cũng là vấn đề mà chúng ta cần công nghệ để giải quyết, để khi mà công nghệ không đáp ứng được, chúng ta vẫn có thể tự vận động, tự ra công nghệ để giải quyết vấn đề.

Theo bạn thì những công nghệ web nào sẽ là trends trong những năm tới ??? Cùng bàn luận với mình ở phần comment nhé .

Tham khảo

#technical trending#web#web trending#front end
13
0
...