Vũ Công Thành - Thiết Kế Website - Seo - Nhiếp Ảnh
Vietnamese
Vũ Công Thành - Thiết Kế Website - Seo - Nhiếp Ảnh
English
  1. Trang Chủ
  2. Website
  3. Kiến Thức Tổng Hợp
Giới thiệu về NativeScript

Giới thiệu về NativeScript

Trong bài này, chúng ta sẽ tìm hiểu về NativeScript, một framework mã nguồn mở dùng để xây dựng các ứng dụng di động bằng JavaScript. Vào cuối của bài viết này, bạn sẽ hiểu rõ về NativeScript, cách hoạt động và những công nghệ mà nó sử dụng
22-09-2018
64
Trong bài này, chúng ta sẽ tìm hiểu về NativeScript, một framework mã nguồn mở dùng để xây dựng các ứng dụng di động bằng JavaScript. Vào cuối của bài viết này, bạn sẽ hiểu rõ về NativeScript, cách hoạt động và những công nghệ mà nó sử dụng. Bên cạnh đó, chúng ta cũng sẽ trả lời các câu hỏi phổ biến mà bạn có thể gặp phải khi khám phá một công nghệ mới, chẳng hạn như nó khác thế nào so với các giải pháp khác như Cordova và React Native, và Telerik liên quan đến dự án như thế nào.
 
Giới thiệu về NativeScript

1. NativeScript là gì?

NativeScript là một framework dùng để xây dựng các ứng dụng di động đa nền tảng. Nó cho phép các nhà phát triển sử dụng XML, CSS và JavaScript để xây dựng các ứng dụng dành cho Android, iOS, và cả Windows Universal Platform. Không giống như Cordova, sử dụng WebView để kết xuất giao diện người dùng của ứng dụng, NativeScript sử dụng cơ chế kết xuất gốc của nền tảng, có nghĩa là nó cung cấp một trải nghiệm người dùng gốc thật sự.

2. Ưu điểm

Nó miễn phí và là mã nguồn mở. Điều này có nghĩa là bạn có thể đóng góp vào code và sử dụng nó thế nào tuỳ bạn, miễn là bạn không vi phạm giấy phép Apache 2.0.
Nó cho phép bạn xây dựng các ứng dụng gốc thật sự cho các thiết bị Android và iOS. Mỗi thành phần UI (giao diện người dùng) mà NativeScript trình bày được dịch sang các thành phần UI gốc tương ứng của nó.
Nó cho phép bạn truy cập API gốc của nền tảng thông qua code JavaScript. Bạn không cần phải có kiến ​​thức về Java hoặc Objective-C để sử dụng API gốc của nền tảng bởi vì bạn có thể viết toàn bộ ứng dụng bằng JavaScript. Điều này có nghĩa là nếu bạn cần truy cập vào một tính năng của thiết bị cụ thể, bạn chỉ cần học cách truy cập vào các API gốc bằng JavaScript.
Nó mang lại cho người dùng một trải nghiệm gần gũi hơn so với những nền tảng được cung cấp bởi các framework ứng dụng di động lai như Cordova.
 
Nó cho phép các nhà phát triển dễ dàng xây dựng, triển khai và quản lý các ứng dụng NativeScript của họ thông qua nền tảng Telerik. Tôi sẽ đề cập đến nền tảng Telerik trong phần sau.
Nó có hỗ trợ zero-day cho các nền tảng mới. Điều này có nghĩa là bạn có thể sử dụng ngay lập tức API và các thành phần UI mới nhất bất cứ khi nào Google hoặc Apple cập nhật nền tảng của họ.
Tài liệu hướng dẫn cung cấp cho bạn rất nhiều thông tin về cách làm quen, những khái niệm cốt lõi và giao diện người dùng. Ngoài ra còn có các ví dụ, các hướng dẫn, một diễn đàn, những câu hỏi trên Stack Overflow, và các ứng dụng mẫu có thể giúp người mới bắt đầu làm quen với NativeScript.
Bạn có thể viết các ứng dụng NativeScript của bạn bằng TypeScript. TypeScript là một ngôn ngữ chuyển tiếp sang JavaScript và thêm khả năng lập trình hướng đối tượng vào JavaScript.
Bất kỳ thư viện JavaScript nào mà bạn có thể tìm thấy trên npm mà không dựa vào trình duyệt và DOM đều có thể được sử dụng trong NativeScript. Các ví dụ về các thư viện như vậy gồm có các thư viện tiện ích chẳng hạn như lodash và underscore.
 
Bạn hầu như có thể làm bất cứ thứ gì với NativeScript CLI. Những tác vụ cơ bản như tạo một dự án mới, thêm một nền tảng, chạy trên một thiết bị và triển khai đến một nền tảng cụ thể đều có hết. Bên cạnh đó, bạn còn có thể cài đặt plugin, gỡ lỗi ứng dụng và tải ứng dụng lên app store.
 
Giới thiệu về NativeScript

3. Nhược điểm

Không có HTML và DOM trong NativeScript. Bạn sẽ cần phải học cách sử dụng các thành phần UI khác nhau để xây dựng UI của ứng dụng.
Các plugin đã được kiểm chứng vẫn còn thiếu. Vào thời điểm viết bài này, chỉ có tổng cộng 16 plugin đã được kiểm chứng. Mặc dù có rất nhiều plugin dành cho NativeScript được liệt kê trên npm, nhưng bạn không bao giờ thật sự chắc chắn về chất lượng của chúng.
Các nhà phát triển cần phải biết các API gốc trên Android và iOS để có thể truy cập phần cứng của thiết bị và các tính năng đặc trưng của nền tảng.
 
Do tính năng gốc của nó, bạn chỉ có thể chạy thử các ứng dụng trên một thiết bị thật hoặc một emulator. Điều này làm cho việc thiết lập ban đầu để chạy thử trở nên chậm hơn. Nhưng một khi bạn đã làm cho nó chạy trên thiết bị, thì nó sẽ tự động tải lại. Điều này có nghĩa là mỗi khi bạn thực hiện một sự thay đổi trong mã nguồn, thì nó sẽ tải lại ứng dụng ngay lập tức để phản ánh các thay đổi đó.
Không phải tất cả các thành phần UI đều miễn phí. Bạn cần phải mua Telerik UI dành cho NativeScript nếu bạn muốn sử dụng các thành phần như Chart và Calendar.

4. Nó làm việc như thế nào?

NativeScript cấu thành từ một máy ảo JavaScript, một runtime và một mô-đun bridge. Máy ảo JavaScript biên dịch và thực thi code JavaScript. Sau đó, mô-đun bridge chuyển đổi các cuộc gọi đến các API của nền tảng cụ thể và trả về kết quả cho code gọi. Nói một cách đơn giản, NativeScript cung cấp cho các nhà phát triển một cách để gởi lệnh đến nền tảng gốc thông qua JavaScript thay vì Objective-C trên iOS hoặc Java trên Android.
 
Tất nhiên, có rất nhiều thứ diễn ra ở phía sau, nhưng các nhà phát triển tại Telerik giải thích nó rõ hơn tôi, vì vậy nếu bạn muốn tìm hiểu thêm về hoạt động bên trong của NativeScript, bạn có thể đọc bài viết của Georgi Atanasov về NativeScript - Tổng quan về Kỹ thuật hoặc bài viết của TJ VanToll về Cách Hoạt động của NativeScript.

5. Nó sử dụng Công nghệ nào?

Với NativeScript, bạn sử dụng XML để cấu trúc UI của ứng dụng, CSS cho phong cách, và JavaScript để thêm tính năng. Bạn có thể sử dụng TypeScript cùng với Angular 2 nếu bạn muốn sử dụng một framework để cài đặt code JavaScript của bạn. 
 
Đối với giao diện, NativeScript chỉ sử dụng một bộ con của CSS. Điều này có nghĩa là không phải tất cả các tính năng CSS có trong môi trường trình duyệt đều có thể được sử dụng. Ví dụ, bạn không thể sử dụng thuộc tính float hoặc position. Dưới đây là danh sách đầy đủ về các thuộc tính CSS được hỗ trợ. Tương tự như trong trình duyệt, bạn có thể thêm các phong cách áp dụng cho toàn bộ ứng dụng, cho các trang cụ thể hoặc chỉ cho một thành phần UI cụ thể. Nếu bạn thích sử dụng Sass, bạn có thể cài đặt plugin NativeScript Dev Sass.
 
Để mô tả cấu trúc của giao diện người dùng, bạn sử dụng XML. Mỗi trang trong ứng dụng nên nằm trong tập tin XML của riêng nó. NativeScript có kèm theo các widget giao diện người dùng được định nghĩa sẵn hoặc các thành phần mà bạn có thể sử dụng để xây dựng UI của ứng dụng. Một số thành phần này giống với các phần tử HTML khác nhau mà bạn sử dụng trong trình duyệt.
 
Ví dụ, có một thành phần Image, tương đương với phần tử img, hoặc thành phần TextField, tương đương với phần tử input có type là text. Các trình xử lý (handler) sự kiện như chạm vào một nút được thêm vào trong chính thành phần đó. Dưới đây là một ví dụ:
 
exports.doSomething = function(){
    // do something
}
 
Một điều khác cần lưu ý là, các thành phần cũng đóng vai trò như là template. Nếu bạn rành về các thư viện xử lý template như Handlebars hoặc Mustache, thì bạn sẽ thấy quen với cú pháp sau đây:
Ví dụ ở trên sử dụng thành phần ListView. Như tên gọi của nó, thành phần này cho phép bạn tạo ra các danh sách. animals là một mảng được định nghĩa bên trong tập tin JavaScript và được ràng buộc với biến animals khi tải trang. Việc này làm cho biến animals sẵn có để sử dụng bên trong tập tin XML.
 
var animals = ['panda', 'tiger', 'monkey', 'snake', 'mantis'];
function pageLoaded(args){
    var page = args.object;
 
    page.bindingContext = {
        animals: animals
    }
}
 
Code này xuất ra mỗi phần tử trong mảng bên trong ListView.
Cuối cùng, có các plugin cho phép bạn truy cập vào phần cứng của thiết bị và các tính năng trên nền tảng cụ thể. NativeScript có kèm theo một plugin camera. Điều này cho phép bạn truy cập vào camera của thiết bị và chụp ảnh. Sau đó, bạn có thể lưu đường dẫn cục bộ đến hình ảnh trong ứng dụng của bạn để sử dụng sau này. Các tính năng trên nền tảng cụ thể như chia sẻ trên mạng xã hội cũng có thể được sử dụng bằng cách cài đặt các plugin chẳng hạn như NativeScript Social Share Plugin.

6. Bạn có thể xây dựng những ứng dụng nào?

Do tính chất gốc của NativeScript, bạn có thể xây dựng hầu hết bất kỳ loại ứng dụng nào bằng nó. Dưới đây là một số ví dụ về các ứng dụng mà bạn có thể xây dựng bằng NativeScript:
 
Các ứng dụng giao tiếp với máy chủ, chẳng hạn như ứng dụng tin tức và ứng dụng mạng xã hội.
Những game đơn giản như cờ vua, tic-tac-toe, hoặc pinball.
Các ứng dụng theo thời gian thực như ứng dụng chat hoặc live feeds. Có một plugin Firebase dành cho NativeScript mà bạn có thể sử dụng để cài đặt các ứng dụng theo thời gian thực.
Ứng dụng stream nhạc và video. Có một plugin video player cho phép bạn phát video được lưu trữ cục bộ hoặc stream các video từ xa chẳng hạn như những video trên YouTube.
Các ứng dụng bản đồ và vị trí địa lý. Có các plugin dành cho Google Maps và các API bản đồ gốc.
Các ứng dụng truy cập vào phần cứng của thiết bị. Các ví dụ bao gồm các ứng dụng camera và IoT.
Khi đề cập đến các kiểu ứng dụng mà bạn có thể xây dựng bằng NativeScript, thì hạn chế duy nhất là hiệu năng và tính khả dụng của plugin. Viết các ứng dụng di động gốc bằng JavaScript bạn sẽ phải chấp nhận: bạn không thể thật sự kỳ vọng sẽ xây dựng các ứng dụng đòi hỏi hiệu năng cao. Các ví dụ gồm có các game có đồ hoạ và hiệu ứng động phức tạp, các ứng dụng với nhiều phần chuyển động và các tiến trình nền.
 
Một hạn chế nữa là tính sẵn có của plugin. Hầu hết các nhà phát triển đến với NativeScript xuất phát từ phát triển web. Điều này có nghĩa là phần lớn họ không rành hoặc có kiến ​​thức hạn chế về các API của nền tảng gốc có thể được sử dụng để tạo plugin để truy cập vào phần cứng của thiết bị hoặc các tính năng của nền tảng cụ thể chẳng hạn như danh bạ hoặc tin nhắn.
 
Nếu bạn muốn tìm hiểu thêm về những loại ứng dụng mà bạn có thể tạo bằng NativeScript, bạn có thể truy cập trang App Showcases. Hầu hết các ứng dụng được liệt kê trong đó đều được xuất bản trên cả Google Play Store và Apple Store. Điều này có nghĩa là bạn có thể cài đặt nó và chạy nó trên thiết bị của bạn để có được cảm nhận về những ứng dụng được xây dựng bằng NativeScript như thế nào và cách chúng hoạt động ra sao.
 
Giới thiệu về NativeScript

7. NativeScript khác gì so với các framework Hybrid?

Nếu bạn không phải là người lần đầu phát triển ứng dụng di động, thì bạn có thể đã bắt gặp các framework như Cordova và React Native. NativeScript có liên quan đến hai framework trong đó cả hai đều nhằm giải quyết vấn đề "Viết một lần, chạy ở mọi nơi" trong lĩnh vực phát triển ứng dụng di động. Bây giờ hãy so sánh từng framework:

Cordova React Native NativeScript

Người tạo Nitobi; Sau đó được mua bởi Adobe Systems Facebook Telerik
UI HTML Các thành phần UI được dịch sang các thành phần gốc tương ứng Các thành phần UI được dịch sang các thành phần gốc tương ứng
Có thể chạy thử trên Trình duyệt, emulator, thiết bị Emulator, thiết bị Emulator, thiết bị
Viết bằng HTML, CSS, JavaScript Các thành phần UI, JavaScript, bộ con của CSS Các thành phần UI, bộ con của CSS, JavaScript
 
Truy cập tính năng gốc Thông qua các plugin Các mô-đun gốc Truy cập API gốc thông qua JavaScript
Triển khai đến Android, iOS, Ubuntu, Windows, OS X, Blackberry 10 Android và iOS. Sắp ra mắt cho Windows Universal và Samsung Tizen Android và iOS. Sắp có cho Windows Universal
Các thư viện JavaScript và framework Bất kỳ thư viện hoặc framework front-end nào (ví dụ: Angular, Ember) Bất kỳ thư viện nào không phụ thuộc vào trình duyệt Bất kỳ thư viện nào không phụ thuộc vào trình duyệt
 
Thiết kế mẫu Bất kỳ framework front-end nào có thể được sử dụng để cấu trúc code Markup cho UI, JavaScript và CSS mặc định đều được gộp chung với nhau trong một tập tin
Mẫu MVVM/MVC
Code JavaScript được thực thi như thế nào WebView JavaScriptCore Engine để thực thi code của ứng dụng trên cả Android và iOS
Webkit JavaScriptCore engine để thực thi code của ứng dụng trên iOS và JavaScript engine V8 của Google trên Android
 
Nói tóm lại, Cordova là framework ứng dụng di động lai thế hệ cũ. Nó sử dụng WebView để kết xuất UI của ứng dụng và truy cập các tính năng gốc của thiết bị thông qua các plugin. React Native và NativeScript là thế hệ mới bởi vì chúng dịch code JavaScript của bạn để nó có thể được thực thi bởi nền tảng gốc.
 
Một vài người có thể nghĩ ra những cái tên tốt hơn cho các framework giống như React Native và NativeScript trong tương lai. Nhưng bây giờ hãy phân loại chúng là "Những Framework Native Hybrid" vì cả hai đều sử dụng JavaScript để tạo các ứng dụng và cả hai đều cung cấp trải nghiệm và hiệu năng tương tự như ứng dụng gốc cho người dùng.

8. Telerik liên quan như thế nào đến dự án?

Telerik là công ty đã tạo ra NativeScript. Và, cũng giống như bất kỳ công ty nào khác, họ cần phải kiếm tiền để tồn tại. Do đó, bạn có thể tự hỏi, nếu NativeScript là miễn phí và là mã nguồn mở, thì làm thế nào để Telerik kiếm tiền từ nó? À, câu trả lời là thông qua Telerik Platform và Telerik UI dành cho NativeScript.
 
Telerik Platform cung cấp cho các nhà phát triển những công cụ họ cần để dễ dàng thiết kế, xây dựng, thử nghiệm, triển khai, quản lý và đo lường hiệu suất của các ứng dụng NativeScript. Sau đây là một vài ví dụ về các công cụ mà họ cung cấp:
 
Một Builder trực quan cho phép bạn kéo và thả các thành phần UI khác nhau
Một cơ sở dữ liệu đám mây cung cấp cơ sở dữ liệu cho ứng dụng của bạn
cập nhật ứng dụng trực tiếp để dễ dàng đẩy các bản cập nhật lên ứng dụng mà không cần phải gửi lại ứng dụng đến app store và yêu cầu người dùng cập nhật ứng dụng một cách thủ công
một dịch vụ phân tích trả lời các câu hỏi chẳng hạn như ứng dụng của bạn đang được sử dụng như thế nào, hoạt động ra sao và người dùng của bạn nghĩ gì về nó
Telerik UI dành cho NativeScript là một bộ các thành phần dùng để xây dựng UI của ứng dụng. NativeScript có sẵn các thành phần UI miễn phí, nhưng còn có các thành phần UI trả tiền khác như Chart và Calendar mà bạn chỉ có thể sử dụng khi mua từ Telerik.
Bài Viết Khác
Vũ Công Thành - Thiết Kế Website - Seo - Nhiếp Ảnh