October 17, 2021

Up and Running with NativeScript

Last spring the development team at Telerik unveiled its biggest project yet: NativeScript.

NativeScript is a runtime for building completely native applications for iOS and Android using either JavaScript or TypeScript. Yes, you read that correctly. NativeScript makes it possible to develop fully functional native applications without the need to learn Objective-C or Java.

NativeScript Logo

The NativeScript runtime also gives you the power to style applications using css, and provides different custom components for building user interfaces for both Android and iOS devices.

The Telerik team really did a phenomenal job when building the NativeScript runtime. It grants JavaScript developers access to 100% of the native APIs on both iOS and Android – an extremely significant advancement. Although this may sound confusing at first, it’s actually quite simple to understand. This article aims to simplify the process of how NativeScript produces such results. Once you understand that you’ll have a much better understanding of how powerful this new technology really is.

How It Works

NativeScript is not a framework; rather it is a runtime that targets the JavaScript VMs (Virtual Machines) on Android and iOS devices.

On Android the V8 engine is the JavaScript VM, whereas iOS devices rely on the JavaScriptCore engine.

NativeScript targets both of these JavaScript VMs in order to access the different native APIs on a device. This is where NativeScript differentiates itself from the group. When building native applications using technologies such as Apache’s Cordova, your code will be packaged in a container in order to access the native APIs for iOS and Android devices.

The NativeScript runtime, on the other hand, was developed to be a bridge rather than a container. It allows JavaScript code to run on native devices. The Cordova container displays native applications as ‘web views’ whereas NativeScript runs your JavaScript code to display native experiences.

You can read more about NativeScript metadata through this link. Simplified it’s what NativeScript injects to access native APIs.

Live Example

Let’s take a look at the following block of code.

var time = new android.text.format.Time();
time.set( 1, 0, 2015 );
console.log( time.format( "%D" ) );

This is valid NativeScript code and it would result in the string ‘01/01/2015’. In this example, the NativeScript runtime tells the V8 JavaScript Engine that we need to access Android’s time API.

The V8 JavaScript engine does not know how to read Android properly, so NativeScript needs to use metadata to help translate this into a format that a native API on a device can understand.

In that example the Android object is a bit specific, so NativeScript offers a broad variety of cross-platform components. The Telerik team does not want you to have to learn iOS or Android specific terms.

This ability to create cross platform applications is yet another reason why NativeScript is so powerful. Without having to modify a single line of code, developers can use JavaScript to reach both iOS and Android devices. Because NativeScript targets both the JavaScriptCore and V8 virtual machine, the runtime offers the ability to utilize the latest features of these engines as soon as they’re implemented.

Now that you have a basic understanding of NativeScript you should go on and check it out for yourself. The Telerik team has been generating a great deal of buzz with its release, and for good reason. I’ve provided a few links below to videos and other resources for learning NativeScript.

As always, if you have any questions about the NativeScript runtime I would be happy to answer them!

NativeScript Resources

Thomas Greco is a web developer based out of New York City specializing in full-stack development with the M.E.A.N. stack technologies. Before web development Thomas worked as a graphic designer, and he continues to utilize his background in design when building web applications. Have a question for Thomas? You can reach him at [email protected] or on social media via Twitter.

One Comment

Leave a Reply

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