NativeScript 8: Let’s Find Out What’s New About It

NativeScript team has come up with the new NativeScript 8 upgrade and also recently releases a bug fix and stabilization update. Let’s find out what’s new about it.

4 min read
Dec 30, 2021

Let’s hear it, NativeScript may not be the most popular framework for app development, but that doesn’t mean it’s not one of the powerful frameworks. With the constant new upgrades and bug fixes being released, NativeScript solidifies its future as a modern JavaScript-based app development framework.

The best thing about NativeScript is it does not have a very steep learning curve, meaning it is easy to learn and apply by leveraging the web skills to build apps with native UI. The framework works well when combined with JavaScript and TypeScript or frameworks based on these languages.

Earlier this year, the NativeScript team released the new version upgrade 8.0. Recently, they have also released NativeScript 8.1 for bug fixing and stabilization. Let’s find out what’s new about these releases.

NativeScript 8: Let’s Find Out What’s New About It

NativeScript 8 & 8.1 address some of the oldest requested and long-desired features such as official support for Apple M1, support for webpack5, first class a11y support, etc. All these features are said to enhance the performance and workability of the NativeScript apps. Here’s an overview of what these upgrades collectively offer for app development.

  • Added structural integrity with the official eslint package.
  • Added support for creative view development via new RootLayout.
  • New Capacitor integration that affirms the broad use case applicability.
  • Added support for webpack5 and Apple M1.
  • Support for CSS box-shadow (requested since 2015) and CSS text-shadow.
  • New Hidden binding property for increased performance
  • New Rootlayout container
  • And many more planned for the future as listed on their RoadMap.

Let’s understand major feature updates included in NativeScript 8 and how it will improve new applications built using the framework.

1. Support for webpack5

Webpack config in NativeScript manages all the supported frameworks. It takes care of all the webpack requirements of supported frameworks, which streamlines the features across all while sharing a common base config.

Developers retain full control of the final config to customize any aspect. Another great feature in this upgrade is plugins can do anything with the project config — they can automatically register new loaders and rules. This will eliminate the manual copying of the loaders and webpack plugins.

The underlying base config can easily be upgraded without making any changes in the project.

2. CLI Updates

With NativeScript 8.1, the CLI has been updated to support “workspace development.” Many of the workspace style tools such as Lerna, Yarn Workspaces, and others have become an integral part of software development.

In the 8.1 update of the NativeScript, there were several changes made to path resolution for apps to integrate into these workspace tools. Before NativeScript 8.1, it was a bit awkward to manage paths inside apps in workspaces and share dependencies.

With the 8.1 version being launched, managing dependency trees by setting up a CLI package can now be properly used in workspaces.

3. The New RootLayout

NativeScript 8 introduced a new layout container that extends GridLayout and offers APIs for fun and dynamic view creation and layering. This new layout is designed primarily as a root layout container for easily controlling dynamic view layers in the NativeScript apps.

Since it extends the GridLayout, the features in the new RootLayout are enhanced with additional APIs.

4. Accessibility: first class a11y

People at Denmark’s national library for people with reading disabilities provided a fantastic a11y plugin that comes with nativescript-accessibility-ext. Also, thanks to one of the contributors, a11y is now built directly into the core of the NativeScript 8.0.

There are two ways to enable a11y support for the NativeScript app. One is through view attributes and another is CSS property. The latter option is better as it allows the use of CSS classes for enabling the a11y features. However, both options offer the desired flexibility to enable a11y support.

5. CSS Box-Shadow

Css Box-Shadow

(Source)

This feature was first requested back in 2015 and since then it has been one of the most requested features for the NativeScript framework. This CSS property adds a shadow effect around an element’s frame.

The box-shadow in the NativeScript allows usage of any short-hand variants to describe X and Y offsets relative to the element, blur and spread radius, and color. Here’s how it looks like in action:

Other minor to major updates in NativeScript 8.0 include:

  • Similar to the Box-Shadow, another feature that makes it to the list is the support for Text-Shadow. You can also apply multiple shadows to text separated by a comma.
  • A support tool for debugging iOS is added, which will add deep interactive debugging for iOS.
  • Integration for Apple Pay and Google Pay plugins.
  • NativeScript 8.0 provides BottomNavigation and Tabs UI components.

Minor and Major updates included in NativeScript 8.1:

  • 8.1 introduces a new command ns typing that helps generate .d.ts files on demand from the native dependencies.
  • The upgrade allows plugins to include kotlin source files inside the Platforms/android folder.
  • A new environment to allow debugging of remote Android devices.
  • No longer native dependencies will be built multiple times.
  • The tailwind version is updated, making it easy to use than ever.
  • Includes support for Vector drawable for Android apps.

Final Words

NativeScript 8.0 and 8.1 include many other features updates and bug fixes, which you can check out here on their official blog. As mentioned in the Roadmap, there will be many more features updates and bug fixes that are yet to be released. Most likely they will arrive next year. So, till then let’s just wait for people behind NativeScript to surprise us with groundbreaking updates.

You may also like

blog?.data?.blog_image?.alt
Dec 23, 2021

Angular 13: What Makes it Tick for Enterprise Frontend Development?

Last month Angular team released a major upgrade of the framework with many groundbreaking features and improvements. Let’s get to see t...
4 min read
Read More
blog?.data?.blog_image?.alt
May 14, 2022

Flutter in 2023: What are the Plans & Roadmap for Flutter?

The Flutter's Strategic Plan & Roadmap 2023 Ahead · Developer Experience, Quality Support to Multiple Platforms, Framework, Engine, Language Improvements...
6 min read
Read More
blog?.data?.blog_image?.alt
Jan 3, 2023

Firebase & AngularFire Update changes for versions 8 to 9

Firebase version 8. x and use a modular bundle like Webpack and Rollup for Web packing as well as ongoing Version 9 development. Firebase & AngularFire update changes for versions 8 to 9.
2 min read
Read More

Let’s Connect!

Work can be a fun when we know and understand each other well. Let's start conversation to new beginning
  • Give us a Call

    +91 63542 35108

    To discuss what we can do for you Give us a Call
  • Write to us

    connect@ashutec.com

    Tell us about your next project Write to us

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.