Community hub
0 subscribers7 pages, 0 posts
Recent from talks
All channels
Be the first to start a discussion here.
Be the first to start a discussion here.
Be the first to start a discussion here.
Be the first to start a discussion here.
Contribute something
Welcome to the community hub built to collect knowledge and have discussions related to NativeScript.
Nothing was collected or created yet.
NativeScript
View on Wikipediafrom Wikipedia
 | This article contains promotional content. (October 2024) |
| NativeScript | |
|---|---|
 | |
| Original author | Telerik by Progress Software.[1] |
| Developer | Community |
| Initial release | 2014 |
| Stable release | 8.8.3[2] 
/ 23 October 2024 |
| Repository | |
| Written in | JavaScript, TypeScript |
| Platform | Cross-platform |
| License | Apache License 2.0 |
| Website | nativescript |
NativeScript is a JavaScript-based cross-platform open-source development framework to develop apps for iOS, visionOS and Android platforms. It connects platform APIs directly to the JavaScript runtime (with strong types). combining familiar Web approaches like CSS and view templating with common platform languages (Swift, Kotlin, Objective-C, Java).
It was originally conceived and developed by Bulgarian company Telerik, later acquired by Progress Software.[3] At the end of 2019[4] responsibility for the NativeScript project was taken over by long-time Progress partner, nStudio. In December 2020, nStudio also oversaw the induction of NativeScript into the OpenJS Foundation as an Incubating Project.[5] NativeScript apps are built using JavaScript, or by using any programming language that transpiles to JavaScript, such as TypeScript. NativeScript supports the Angular[6] and Vue JavaScript frameworks.[7] Mobile applications built with NativeScript result in fully native apps, which use the same APIs as if they were developed in Xcode or Android Studio.[8] Additionally, software developers can re-purpose third-party libraries from CocoaPods, Maven, and npm.js in their mobile applications without the need for wrappers.[9][10][11]
Development
[edit]NativeScript was publicly released first in March 2015. Version 1.0.0 followed two months later.[12] The framework quickly gained popularity reaching 3000 github-stars and over 1500 followers on Twitter soon after the public release.[13] In the meantime, over 700 plugins are available, which are either officially supported by Progress or stem from the open source community.[14][15] The use of Angular is an optional development approach allowing for application source code to be shared between the web platform and mobile platform.[16]
Structure
[edit]NativeScript and all the required plugins are installed using the package manager npm. Projects are created, configured, and compiled via the command line or a GUI tool called NativeScript Sidekick.[17]
Platform-independent user interfaces are defined using XML files. NativeScript then uses the abstractions described in the XML files to call native UI elements of each platform. Application logic developed in Angular and TypeScript can be developed independent of the target platform as well. A NativeScript mobile application is built using the node.js runtime and tooling.[18] Progress aims for a ratio of 90% common code between the iOS and Android platforms.[1]
Direct access to native platform APIs and controls
[edit]Platform-independent user interfaces are defined using XML files.[19] NativeScript uses the XML data structures representing the cross platform abstraction to trigger platform-specific code that directly interacts with the native elements of the target operating system. This means a call to the NativeScript Button API provides a UI abstraction for Button, which directly calls UIButton on iOS[20] or com.android.widget.Button on Android.[21]
While application source code is written in JavaScript, TypeScript, Angular, or Vue.js, the source code is not compiled or otherwise mutated. The source code as-is runs directly on the device. This architectural choice eliminates the need for cross-compiling or transpiling.[11] Additionally, while the application source code is written in languages commonly encountered in a browser (or in a WebView-contained mobile application) NativeScript applications run directly on the native device. There is no DOM manipulation or any mandatory browser interaction.[6]
Notable features
[edit]Native API reflection
[edit]Another notable feature is the use of reflection to handle native API endpoints. Rather than requiring separate binding layers between NativeScript and each mobile platform API, NativeScript uses reflection to gain information and metadata about the native platform APIs. New features added to any native platform API are available immediately.[6]
Another way the reflection feature is used is in working with third party libraries. As JavaScript (or TypeScript/Angular) can talk directly to native code, there is no need to write binding layers in Objective-C, Swift, Java or Kotlin.[11][22]
Angular integration
[edit]With the launch of NativeScript 2.0, it is possible to use Angular to build cross-platform mobile applications.[23] Additionally, when using Angular with NativeScript you have the ability to share large chunks of code between your web and mobile apps.[24]
Vue.js integration
[edit]The Vue.js framework is supported in NativeScript via the nativescript-vue plugin.[7]
Supporting tools and services
[edit]- NativeScript Sidekick is a graphical user interface that builds off of the capabilities provided by the NativeScript CLI. With Sidekick a developer can leverage app templates, cloud-based builds for iOS and Android, and publish apps to the public app stores.
- NativeScript Playground allows developers to experiment with NativeScript in a web-based environment, and preview apps on physical devices.
- NativeScript Marketplace is a curated source of NativeScript plugins, pre-built app templates, and runnable sample apps.
References
[edit]- ^ a b "Frequently asked questions about NativeScript". NativeScript.org. Archived from the original on 2016-03-18. Retrieved 2016-03-20.
- ^ https://github.com/NativeScript/NativeScript/releases/tag/8.8.4-core.
{{cite web}}: Missing or empty|title=(help) - ^ "Creating Mobile Native Apps in JavaScript with NativeScript". InfoQ. Archived from the original on 2022-06-19. Retrieved 2022-07-12.
- ^ Saripella, Surya. "The Next Chapter for NativeScript: nStudio". NativeScript. Archived from the original on 2021-01-16. Retrieved 2022-07-12.
- ^ Romoff, Rachel (7 December 2020). "NativeScript joins OpenJS Foundation as Incubating Project". The Linux Foundation Projects. OpenJS Foundation. Archived from the original on 25 January 2021. Retrieved 4 March 2021.
- ^ a b c Krill, Paul (March 10, 2015). "JavaScript goes native for iOS, Android, and Windows Phone apps". InfoWorld. Archived from the original on January 3, 2022. Retrieved July 12, 2022.
- ^ a b "NativeScript-Vue". nativescript-vue.org. Retrieved 2017-10-31.
- ^ "NativeScript framework eases cross-platform app development woes". searchcloudcomputing.techtarget.com. Archived from the original on 2021-08-06. Retrieved 2021-08-06.
- ^ Krill, Paul (May 6, 2016). "NativeScript warms up to AngularJS for mobile dev". InfoWorld. Archived from the original on June 12, 2022. Retrieved July 12, 2022.
- ^ "SD Times GitHub Project of the Week: NativeScript". March 18, 2016. Archived from the original on March 27, 2022. Retrieved July 12, 2022.
- ^ a b c "Telerik's NativeScript Aims To Centralize Cross-Platform Mobile Development -". Visual Studio Magazine. Archived from the original on 2017-11-07. Retrieved 2016-11-21.
- ^ "NativeScript 1.0.0 Released". www.i-programmer.info. Archived from the original on 2022-06-11. Retrieved 2022-07-12.
- ^ "NativeScript 1.0.0 is now available". NativeScript.org. Archived from the original on 2016-10-05. Retrieved 2016-11-04.
- ^ "NativeScript Marketplace". market.nativescript.org. Archived from the original on 2018-03-15. Retrieved 2018-03-14.
- ^ "nativescript - npm search". www.npmjs.com. Archived from the original on 2017-02-11. Retrieved 2016-11-21.
- ^ "Getting to Know Angular 2". mobile.htmlgoodies.com. 15 November 2016. Archived from the original on 27 September 2019. Retrieved 12 July 2022.
- ^ "NativeScript Sidekick - your faithful companion for app development". NativeScript.org. Archived from the original on 2017-11-07. Retrieved 2017-10-31.
- ^ Hanna, Tam (9 August 2016). "Mit JavaScript wie hausgemacht: NativeScript". Developer. Archived from the original on 2021-07-25. Retrieved 2022-07-12.
- ^ "The Basics - NativeScript Docs". docs.nativescript.org. Archived from the original on 2016-11-21. Retrieved 2016-11-21.
- ^ "NativeScript/NativeScript". github.com. Archived from the original on 2022-06-20. Retrieved 2022-06-20.
- ^ "NativeScript/NativeScript". github.com. Archived from the original on 2022-06-20. Retrieved 2022-06-20.
- ^ "Accessing Native APIs through JavaScript - NativeScript Docs". docs.nativescript.org. Archived from the original on 2016-11-24. Retrieved 2016-11-21.
- ^ "NativeScript 2.0 - the best way to build cross-platform native mobile apps". NativeScript.org. Archived from the original on 2016-12-20. Retrieved 2016-11-21.
- ^ Witalec, Sebastian (2018-08-24). "Apps That Work Natively on the Web and Mobile". Medium. Archived from the original on 2022-01-03. Retrieved 2021-08-06.
External links
[edit]
| Basic frameworks | |
|---|---|
| Site-specific browsers | |
| Dialects | |||||||||
|---|---|---|---|---|---|---|---|---|---|
| Engines | |||||||||
| Frameworks |
| ||||||||
| People |
| ||||||||
| Other | |||||||||
 Lists: JavaScript libraries • Ajax frameworks • Server-side JavaScript Comparison: JavaScript web frameworks | |||||||||
NativeScript
View on Grokipediafrom Grokipedia
NativeScript is an open-source framework that enables developers to build native mobile and cross-platform applications for iOS, Android, visionOS, Android TV, and watchOS using JavaScript, TypeScript, and popular web frameworks such as Angular, Vue.js, React, Svelte, and Solid.[1] It provides direct access to platform-specific APIs from JavaScript code, allowing for high-performance apps with a single shared codebase without requiring knowledge of native languages like Swift or Kotlin.[2]
Originally created in 2014 by Telerik, a Bulgarian software company later acquired by Progress Software, NativeScript quickly gained traction among JavaScript developers for its ability to leverage web skills for native app development.[3] In December 2020, it joined the OpenJS Foundation as an incubating project, overseen by the software consulting firm nStudio, which has fostered its evolution into a fully community-driven initiative under the Linux Foundation's umbrella.[3] As of February 2025, the latest version, NativeScript 8.9, introduces previews of Node-API enabled engines and enhanced support for modern tools like Tailwind CSS v4, underscoring its ongoing commitment to aligning with contemporary JavaScript standards.[4]
Key features of NativeScript include strong TypeScript integration for type-safe development, a rich ecosystem of plugins via its marketplace, and tools like the NativeScript CLI for streamlined workflows including live reloading and cloud builds.[1] It emphasizes natural platform performance and user experience by rendering UI components natively rather than through web views, distinguishing it from hybrid frameworks.[5] NativeScript also supports web deployment, enabling the same codebase to target browsers alongside native platforms, which promotes code reuse and accelerates development cycles.[1]
History and Development
Origins and Founding
NativeScript was founded by Telerik, a software development company based in Sofia, Bulgaria, as an open-source framework aimed at simplifying cross-platform mobile app development. The project emerged from Telerik's mobile team, which had been exploring native development challenges since 2010, recognizing the inefficiencies of building separate applications for iOS, Android, and other platforms. On June 12, 2014, Telerik publicly announced NativeScript with the release of version 0.1 in preview, introducing it as a tool to leverage JavaScript for creating truly native mobile applications while maximizing code reuse and performance.[6] The primary motivation behind NativeScript's creation was to empower web developers familiar with JavaScript to build high-performance native apps without the need to learn platform-specific languages such as Swift for iOS or Java for Android. This approach addressed a key pain point in mobile development: the fragmentation caused by differing APIs and UI paradigms across platforms, allowing developers to access native APIs directly from JavaScript and share business logic across iOS and Android. Initial development efforts centered on establishing a runtime bridge that enables JavaScript code to interact seamlessly with underlying native iOS and Android APIs, ensuring apps could utilize platform-specific UI components for an authentic user experience without compromises in speed or functionality.[6] In late 2014, shortly after NativeScript's announcement, Telerik was acquired by Progress Software Corporation in a deal announced on October 22 and completed on December 2, for approximately $262.5 million. Progress, a U.S.-based enterprise software company, continued to sponsor and support NativeScript's early development, integrating it into their broader portfolio of developer tools while preserving its open-source trajectory under the Apache License 2.0. This acquisition provided additional resources to refine the framework's core bridging mechanisms and expand its foundational capabilities.[7][8]Key Milestones and Evolution
NativeScript was first announced by Telerik on June 12, 2014, as an open-source framework for building native mobile applications using JavaScript, initially supporting core JavaScript for iOS and Android platforms.[6] The framework saw its public release in March 2015, marking the beginning of broader developer adoption with initial JavaScript support and direct access to native APIs. Version 1.0 followed in May 2015, providing stable cross-platform builds and establishing a foundation for consistent iOS and Android app development without compromises on native performance. In 2016, NativeScript 2.0 introduced official integration with Angular 2, enabling developers to leverage Angular's component-based architecture for native mobile apps while maintaining full access to platform-specific features.[9] This release aligned NativeScript with the growing popularity of Angular, facilitating code reuse and enhancing productivity for web developers transitioning to mobile. By June 2017, support for Vue.js was announced through the NativeScript-Vue plugin, allowing Vue's reactive paradigm to drive native UI rendering on mobile devices.[10] These integrations expanded NativeScript's appeal, drawing in communities from established JavaScript frameworks and contributing to its growth beyond vanilla JavaScript applications. The framework's governance evolved significantly at the end of 2019, when Progress Software (following its acquisition of Telerik) initiated a transition to full community stewardship, encouraging open-source contributors to take greater ownership of development and maintenance.[11] This shift from corporate sponsorship to a community-driven model culminated in 2020 with the selection of nStudio as a key steward, fostering sustained innovation through collaborative efforts. In December 2020, NativeScript joined the OpenJS Foundation as an incubating project, further solidifying its community-driven status.[3] NativeScript 8.0, released on March 31, 2021, advanced the platform with features like Apple M1 support, Webpack 5 integration, and improved accessibility, while later versions extended capabilities to non-mobile platforms, including experimental visionOS support for spatial computing applications.[12] [2] Major releases continued to emphasize performance and ecosystem compatibility, with NativeScript 8.9 arriving on February 27, 2025, introducing a public preview of Node-API enabled engines (such as Hermes and V8) for enhanced JavaScript execution, along with iOS widget creation tools and Tailwind CSS v4 integration.[4] This version addressed community feedback on performance and tooling, solidifying NativeScript's role in modern cross-platform development. In 2025, the community marked the framework's approximate 10-year milestone since its 2015 public debut, celebrating sustained growth through events and releases that highlighted its evolution into a versatile tool for native and emerging platforms.[4]Community Transition and Current Status
In late 2019, Progress Software announced an initiative to transition NativeScript's maintenance to the open-source community under the Apache 2.0 license, aiming to foster greater developer involvement and sustainability.[11] This shift culminated in the formation of nStudio, a non-profit organization composed of long-time NativeScript contributors and former Progress partners, which officially assumed stewardship of the project on May 29, 2020.[11] The handover ensured no disruptions to existing applications while emphasizing community-driven evolution.[11] As of November 2025, NativeScript remains under active, community-led development through its primary GitHub repository, which has garnered over 25,000 stars, indicating sustained popularity among developers.[5] The latest stable release, version 8.9.9, was published on September 9, 2025, incorporating runtime improvements for iOS, Android, and visionOS platforms. Contributions are coordinated via GitHub issues and pull requests, with ongoing involvement from former Telerik and Progress engineers affiliated with nStudio, alongside a global network of independent developers. The community supports engagement through an active Discord server for discussions and a dedicated blog for release announcements and tutorials.[13] Looking ahead, NativeScript's 2025 roadmap focuses on expanding platform compatibility, including enhanced support for Apple Vision Pro via visionOS and deeper integration with web technologies for hybrid workflows.[13] Additional priorities include compatibility with modern bundlers like Vite and RsPack, as well as initiatives like Open Native for broader ecosystem alignment.[13] The project sustains momentum through developer events, such as virtual meetups, and certification programs to empower contributors, marking a decade of open-source innovation since its 1.0 release in 2015.[13]Overview and Core Concepts
Definition and Purpose
NativeScript is an open-source framework designed for building truly native cross-platform mobile applications using JavaScript or TypeScript.[1] It allows developers to create apps that render native user interfaces directly through platform-specific APIs, bypassing the use of webviews or hybrid wrappers to achieve authentic native performance and appearance on each supported operating system.[5] This approach enables the compilation of a single codebase into fully native applications for iOS, Android, and emerging platforms such as visionOS.[2] The primary purpose of NativeScript is to empower web developers with JavaScript expertise to transition seamlessly into native mobile app development without requiring knowledge of platform-specific languages like Swift or Kotlin.[1] By providing direct access to native APIs within a JavaScript runtime, it facilitates the reuse of familiar web technologies—such as data binding and UI declaration via XML—while supporting integrations with popular frameworks like Angular, Vue, React, Solid, and Svelte.[5] This bridges the gap between web and native ecosystems, allowing for efficient development of high-performance apps with a shared codebase across multiple platforms.[2] In contrast to hybrid approaches that embed web content within native shells, NativeScript delivers full native capabilities, including optimal speed, precise UI fidelity to platform guidelines, and unrestricted access to device hardware and features.[1] This eliminates common compromises in performance and user experience often associated with hybrid solutions, making it particularly suitable for JavaScript developers aiming to produce professional-grade native applications without deep platform-specific expertise.[2]Supported Platforms and Languages
NativeScript primarily targets mobile platforms, with full support for iOS and Android available since its initial launch in 2014.[5] The framework also extends to web development through its Web runtime, introduced in version 8.0, enabling the same codebase to render in modern browsers. Additionally, experimental support for Apple's Vision Pro (visionOS) was introduced in version 8.6 and enhanced in 8.9; as of 2025, it uses the SwiftUI App Lifecycle. NativeScript further supports Android TV (since at least 2018) and watchOS (via extensions, with beta support since 2019).[4][14][1] At its core, NativeScript uses JavaScript and TypeScript as the primary programming languages, providing direct access to native APIs without requiring wrappers or bridges for these languages.[1] It does not natively support non-JavaScript languages, though integrations with frameworks like Angular, Vue.js, and React are built on top of this JavaScript foundation.[1] This language choice facilitates a single codebase that leverages web development skills for native app creation. One of NativeScript's key strengths is cross-platform code sharing, where up to 90% of the code can be reused across iOS, Android, web, visionOS, Android TV, and watchOS, with platform-specific modules handling differences such as UI components or APIs.[15] Developers structure shared logic in common files while isolating platform-unique implementations, promoting efficiency in multi-platform projects. For device compatibility, NativeScript apps require iOS 11 or later, Android 5.0 (API level 21) or higher, and modern web browsers supporting ECMAScript 2015+ features, such as recent versions of Chrome, Firefox, Safari, and Edge.[16][17] These requirements ensure optimal performance and access to contemporary native features while maintaining broad device coverage.[18]Architecture and Structure
Runtime Environment
The NativeScript runtime environment serves as the foundational layer that enables JavaScript code to execute natively on mobile devices, directly interfacing with platform-specific APIs without intermediaries like WebViews. It leverages the V8 JavaScript engine for both Android and iOS platforms, allowing for high-performance execution of JavaScript while bridging to native code. This unified engine choice, with V8's embedding capabilities and support for JIT-less mode on iOS, ensures consistent behavior across platforms.[19][20] The runtime operates through a metadata-driven binding system that generates JavaScript proxies for native classes, methods, and properties at build time. Metadata is extracted from platform headers using tools like the iOS metadata generator, which employs Clang APIs to parse public declarations and produce binary files containing details on native APIs, such as class structures and method signatures. These files are then linked into the application binary, and at runtime, the V8 engine uses this metadata—along with platform-specific helpers like Objective-C runtime functions—to dynamically create JavaScript-accessible proxies. This approach allows seamless invocation of native code from JavaScript, with automatic type conversion and memory management handled by the runtime.[21][22] Central to the runtime is the @nativescript/core package, which abstracts essential platform APIs into cross-platform JavaScript interfaces. It includes modules for file system operations, such as reading, writing, and managing files and folders via classes like File and Folder; HTTP networking for making requests and handling responses through the Http module. These APIs ensure developers can interact with device hardware and system resources in a platform-agnostic manner.[23][24][25] Unlike Node.js, which is a server-side runtime built around V8 with a full ecosystem of modules for I/O and networking, NativeScript's runtime is optimized for mobile environments, lacking complete Node.js module support but remaining compatible with many npm packages that do not depend on server-specific features. Recent advancements, such as previews of Node-API enabled engines in NativeScript 8.9 (released February 2025), further enhance flexibility by allowing the runtime to support alternative engines like Hermes or QuickJS while maintaining direct native access. This mobile-centric design prioritizes low overhead, fast startup, and native performance over Node.js's broader, non-mobile-focused capabilities.[26][27]UI Declaration and Rendering
In NativeScript, user interfaces are declared using a declarative XML syntax that defines layouts and components, which is paired with JavaScript or TypeScript code-behind files for handling logic, data binding, and interactions. This approach separates the structure from the behavior, allowing developers to define the UI hierarchy in XML files (e.g.,main-page.xml) while implementing event handlers and properties in corresponding .js or .ts files. For instance, a simple layout might use <StackLayout> to arrange elements vertically or horizontally, containing components like <Label> for text display or <Button> for user interactions, with bindings such as text="{{ myProperty }}" linking to variables in the code-behind.[28][29]
The XML declarations are parsed and rendered directly as native platform controls, bypassing any web-based rendering engine to ensure a truly native look and feel. A <Button> element, for example, instantiates a UIButton on iOS and an android.widget.Button on Android, leveraging the platform's native rendering pipeline for optimal performance and responsiveness. This direct mapping to native widgets enables smooth animations and interactions at 60 FPS, as the UI updates occur within the platform's graphics system without the overhead of hybrid webviews. Layout containers like <GridLayout> or <FlexboxLayout> further structure the native views, supporting properties such as row/column definitions or flex directions that translate seamlessly to iOS Auto Layout or Android's ViewGroup equivalents.[30][28][31]
Styling in NativeScript employs a CSS-like syntax applied through external files, inline properties, or scoped rules, supporting selectors such as type (e.g., Button), class (.btn-primary), ID (#submit), and hierarchical (StackLayout > [Button](/page/Button)). Platform-specific overrides are achieved via dedicated files like page.ios.css and page.android.css or selectors prefixed with .ns-ios and .ns-android, allowing tailored adjustments for iOS or Android visuals without duplicating code. CSS variables (custom properties) are fully supported for reusable values, declared at the root level (e.g., :root { --primary-color: blue; }) and overridden as needed. Recent versions integrate Tailwind CSS through the official @nativescript/tailwind plugin, enabling utility-first classes for rapid styling in both v3 and v4, with automatic handling of platform colors and gradients via Lightning CSS in v4.[32][33]
Navigation follows a hierarchical page model managed by the <Frame> component, which handles routing between <Page> instances representing individual screens. Each <Page> serves as the root UI container, encapsulating content within a single child view and optionally including an <ActionBar> for top-level toolbar elements like titles or navigation buttons, which abstracts the iOS UINavigationBar and Android ActionBar. Routing is performed programmatically via methods like frame.navigate({ moduleName: 'next-page' }) for forward navigation or frame.goBack() for backward, supporting modular page transitions with lifecycle events such as navigatingTo and navigatedFrom for state management. This structure enables stack-based navigation with back button support, while components like <BottomNavigation> or <Tabs> handle lateral routing at the same hierarchy level.[34][35][36]
Key Features
Direct Native API Access
NativeScript enables developers to access platform-specific APIs directly from JavaScript or TypeScript code, allowing seamless interaction with iOS and Android native functionalities without the need for intermediate wrappers or bridges. This direct access is facilitated through the runtime's metadata generation and type marshalling, which automatically converts between JavaScript data types and native equivalents, such as numbers, strings, booleans, arrays, and objects. For instance, developers can import and utilize core modules that expose these APIs, like the file system module for handling device storage.[23] A practical example of this access involves retrieving device information, such as battery level. On iOS, the UIDevice class can be invoked directly:const batteryLevel = UIDevice.currentDevice.batteryLevel;, which mirrors the Objective-C API and returns the battery percentage as a float value between 0.0 and 1.0. Similarly, on Android, the BatteryManager can be accessed via the application context: const batteryManager = androidApp.context.getSystemService(android.content.Context.BATTERY_SERVICE); const batteryLevel = batteryManager.getIntProperty(android.os.BatteryManager.BATTERY_PROPERTY_CAPACITY);, providing equivalent functionality to native Java code. These calls leverage the platform's runtime to execute native methods instantaneously from JavaScript.[37][38]
To handle platform-specific code in shared projects, NativeScript supports conditional imports and runtime checks, ensuring compatibility across iOS and Android without compilation errors. Developers can use constructs like if (isIOS) { /* [iOS](/page/IOS)-specific code */ } else if (isAndroid) { /* Android-specific code */ }, where isIOS and isAndroid are utilities from the platform module, or import platform-specific references such as import { ios as iosApp } from '@nativescript/core/application';. This approach allows writing shared logic while branching for native-exclusive features, maintaining a single codebase.
The primary benefits of this direct access include comprehensive utilization of native capabilities, enabling applications to leverage all platform features for enhanced performance and user experience. Notably, it extends to integrating third-party SDKs, such as Firebase for backend services or Google Maps for location features, by incorporating them via platform dependencies like CocoaPods for iOS or Gradle for Android, and then calling their APIs directly from JavaScript. This mechanism, augmented by API reflection for dynamic binding, provides unparalleled flexibility in cross-platform development.[37][39]
API Reflection and Binding
NativeScript employs a reflection-based system to automatically generate JavaScript bindings for native iOS and Android APIs, enabling developers to access platform-specific functionality directly from JavaScript or TypeScript code without writing native language wrappers. This system relies on metadata generation during the build process, which inspects native SDK headers and libraries to produce a compact binary representation of available APIs, including classes, methods, properties, and enums. At runtime, this metadata facilitates dynamic proxy creation, allowing seamless invocation of native code through the JavaScript engine, such as V8 for Android or JavaScriptCore for iOS.[40][41][21] The reflection process occurs at build time and varies by platform. For iOS, the metadata generator uses Clang's APIs, including HeaderSearch and RecursiveASTVisitor, to parse Objective-C and Swift headers from the SDK and any linked third-party libraries, extracting details like method signatures, property types, and protocol definitions while excluding unsupported constructs such as unions or variable argument lists. On Android, Apache Commons BCEL iterates through Java and Kotlin bytecode in dependencies, capturing public APIs tied to the specified compile SDK version (e.g., API level 34 by default) and generating JNI signatures for interop. The resulting metadata file, such asmetadata-arm64-v8a.bin for Android, is embedded in the app package and loaded at runtime via platform-specific mechanisms, like inline assembly for iOS or dynamic linking for Android, to establish bidirectional bindings without deserialization overhead. This approach ensures that only whitelisted APIs are exposed, configurable via a native-api-usage.json file using wildcard rules for blacklisting or inclusion, which helps optimize app size and security by filtering out unused or sensitive native elements.[40][41][21]
Bindings created through this reflection are type-safe wrappers that encapsulate native classes, methods, and properties, providing JavaScript objects that mirror native structures for intuitive access. For instance, developers can instantiate a native class like UIDevice on iOS or BatteryManager on Android, call overloaded methods with automatic signature resolution based on argument types, and set/get properties with implicit type coercion handled by dedicated marshalling layers. Callbacks are supported by allowing JavaScript functions to be passed as arguments to native methods, where the runtime registers them as proxies and invokes them on native events, ensuring thread-safe execution. TypeScript users benefit from auto-generated declaration files (.d.ts) that infer types from the metadata, enabling compile-time checks and IntelliSense support for native APIs, including generics and interfaces where applicable. These wrappers handle non-JSON-serializable data, such as native objects or buffers, through synchronous calls that bridge the JavaScript and native realms without performance-degrading serialization.[42][43][44]
Despite its comprehensiveness, the reflection system has limitations, as not all obscure or private native APIs are automatically included in the metadata due to parsing constraints or deliberate SDK restrictions, potentially requiring developers to target specific compile versions or exclude incompatible elements. Unsupported features, like iOS variable arguments or certain Android internal classes, cannot be bound automatically, and runtime mismatches—such as using a higher API level than compiled for—may trigger exceptions. To address gaps, manual bindings can be implemented via custom plugins that extend metadata generation or use direct native code integration, allowing third-party libraries to be wrapped explicitly with TypeScript definitions.[40][41][39]
The API reflection and binding mechanisms have evolved significantly in NativeScript version 8 and later, with enhancements focused on improved TypeScript integration, such as refined declaration generation in the @nativescript/types package for better inference of native generics and reduced compilation errors during upgrades. Version 8.2 introduced optimizations to type resolution, addressing issues with platform API visibility in TypeScript projects, while subsequent releases like 8.9 added support for Node-API engine previews and finer metadata filtering to enhance error handling and developer experience. These updates build on earlier foundations, prioritizing embeddability and modern JavaScript ecosystem compatibility without altering the core build-time reflection pipeline.[45][4]
Performance Optimizations
NativeScript achieves high performance through its direct use of native UI components, enabling smooth rendering without the overhead of JavaScript bridges typically found in hybrid frameworks. This architecture allows applications to leverage the platform's native rendering pipeline, supporting fluid user interfaces at 60 frames per second (fps) on capable devices by utilizing GPU acceleration for animations and transitions.[46][47] Key optimizations include lazy loading of modules via webpack code splitting, which defers the loading of non-essential code until needed, reducing initial bundle size and improving startup times. For Angular-based applications, ahead-of-time (AOT) compilation further enhances performance by compiling templates and components at build time, minimizing runtime parsing overhead. Additionally, NativeScript employs WeakRef for memory management, particularly in event handling and navigation, to prevent memory leaks by allowing unreferenced objects to be garbage collected without strong retention.[48][49][50] Profiling tools integrated into NativeScript facilitate performance analysis, including the built-in inspector accessible via Chrome DevTools for capturing heap snapshots to identify memory issues and CPU tracing through timeline profiling to pinpoint bottlenecks in execution. These tools enable developers to optimize JavaScript execution and native interactions in real-time during development.[51][52] Benchmarks demonstrate NativeScript's efficiency, with applications achieving startup times under 2 seconds on mid-range Android devices when using optimizations like V8 heap snapshots and code minification, performing comparably to fully native apps in UI responsiveness and data marshalling tasks. For instance, in release mode on iOS, NativeScript 8.3 handles primitive data marshalling in approximately 260 ms, approaching native Objective-C speeds while maintaining cross-platform consistency.[53][54]Framework Integrations
Angular Integration
NativeScript provides official support for Angular integration via the@nativescript/angular package, enabling developers to leverage Angular's component-based architecture while accessing NativeScript's native UI components and APIs for building cross-platform mobile applications on iOS, Android, and visionOS.[1][55]
Project setup is streamlined using the NativeScript CLI, with the command ns create myApp --ng generating a boilerplate Angular application configured for NativeScript, including necessary dependencies and module imports like NativeScriptCommonModule. For production builds, Ahead-of-Time (AOT) compilation is enabled by default, which compiles Angular templates and components at build time to enhance runtime performance and reduce bundle size.[56][57]
Within Angular components, NativeScript directives—such as <GridLayout>, <StackLayout>, and <ListView>—are integrated directly into templates, allowing declarative UI construction that renders native elements without wrappers or bridges. This setup adapts NativeScript's core UI structure for Angular, supporting data binding, directives, and lifecycle hooks in a familiar Angular environment.[56][55]
Key adaptations include platform-specific templates, where conditional logic (e.g., via *ngIf or platform detection services) renders tailored layouts for iOS or Android, optimizing user experience across devices. The Angular router is extended with NativeScript's RouterExtensions for seamless native navigation, handling transitions like back-button behavior and modal presentations without relying on web views.[56][57]
As of 2025, NativeScript maintains full compatibility with Angular 19 and subsequent versions, including support for standalone components, signals, and improved tree-shaking, ensuring developers can adopt the latest Angular advancements in native contexts.[55][1][58]
Vue.js Integration
NativeScript provides integration with Vue.js through the NativeScript-Vue plugin, which enables developers to build cross-platform native mobile applications using Vue's declarative rendering and component-based architecture.[59] This plugin bridges Vue.js with NativeScript's runtime, allowing Vue single-file components to define user interfaces that compile directly to native iOS and Android elements, rather than web views.[60] Vue templates in NativeScript-Vue use XML-like syntax for declaring NativeScript UI components, such as<Page>, <StackLayout>, and <Label>, which render to platform-specific native widgets like UIView on iOS or ViewGroup on Android.[28]
To set up a new project, developers use the NativeScript CLI with the --vue flag, for example: ns create myAwesomeApp --vue.[61] This command scaffolds a project pre-configured with Vue.js, including support for the Vue 3 Composition API, enabling modern reactive patterns like ref and computed for managing component state.[62] NativeScript-Vue aligns with Vue 3 and later versions, ensuring compatibility with the latest ecosystem tools and features.[63]
Unique to this integration are extensions for handling native platform behaviors, such as using Vue's v-if directive combined with NativeScript's platform module for conditional rendering based on the operating system (e.g., if (isAndroid) { ... }).[64] For state management, NativeScript-Vue supports Vuex, with community plugins like nativescript-vuex-persistent providing native persistence by storing state in platform-specific key-value stores, such as SharedPreferences on Android and NSUserDefaults on iOS.[65] This allows application data to survive app restarts without relying on web-based storage mechanisms.[66]
The NativeScript-Vue plugin has been community-maintained since its initial release in 2017, evolving as an open-source project under the MIT license to support ongoing NativeScript updates and Vue advancements.[10]
Other Framework Support
NativeScript supports integrations with several additional JavaScript frameworks beyond its official Angular and Vue.js bindings, enabling developers to leverage familiar paradigms for building native mobile applications. These integrations are primarily community-driven and allow for declarative UI rendering directly to native components on iOS and Android platforms.[1][2] The react-nativescript package provides a React renderer for NativeScript, facilitating the use of JSX syntax to generate native UI elements. This integration translates React components into NativeScript views, supporting core React features such as hooks for state and effect management, as well as standard state handling through useState and similar APIs. Developers can incorporate NativeScript plugins seamlessly within React components, maintaining access to platform-specific APIs.[67][68] For Svelte, the @nativescript-community/svelte-native package enables the compilation of Svelte components into native UI widgets during the build process. This approach combines Svelte's reactive, compiler-based architecture with NativeScript's native rendering, producing efficient updates to platform views like labels, buttons, and layouts without intermediate DOM layers. Key functionalities include native navigation via routing APIs and support for layout containers such as FlexboxLayout and GridLayout.[69] Solid.js integration is available through the @nativescript-community/solid-js package, which patches Solid's renderer to work with NativeScript via the DOMiNATIVE library. This setup preserves Solid's fine-grained reactivity model, where updates are targeted to specific DOM nodes using signals for state management, ensuring performant native UI rendering. Event handling is adapted for NativeScript's event system, using prefixes like "on:raw-" for platform events. Starting with NativeScript 8.9, official templates for Solid.js projects are provided via the CLI, marking it as a supported option for new applications.[70][4] As a fallback, NativeScript inherently supports plain JavaScript and TypeScript without any framework, allowing direct imperative or declarative UI construction using its core XML-based markup and JavaScript bindings to native APIs.[1] These integrations—React, Svelte, and Solid—are largely community-maintained, with ongoing development through GitHub repositories and the NativeScript Discord community. NativeScript 8.9 introduces experimental Node-API engines that enhance compatibility with broader ecosystems, including Ionic and Capacitor, via dedicated bridges that allow NativeScript modules to operate within Capacitor-run environments without impacting web builds.[67][70][26][71]Tools and Ecosystem
CLI and Build Tools
The NativeScript CLI, also known as thens tool, is the primary command-line interface for creating, developing, and deploying NativeScript applications. It is installed globally via npm as a Node.js package using the command npm install -g nativescript, enabling developers to manage projects from the terminal across supported platforms.[17][72]
Core CLI commands facilitate key workflow stages. The ns create <project-name> command initializes a new project template, supporting options for plain TypeScript, Angular, or Vue.js integrations. For development, ns run android or ns run ios compiles and deploys the app to connected devices or emulators, with flags like --watch enabling live reload for real-time updates during coding sessions. Building for release uses ns build android to generate an APK file or ns build ios to produce an IPA archive, often with --release for optimized, signed binaries suitable for distribution. Additional utilities include ns clean to remove build artifacts like node_modules and platform folders, ensuring a fresh environment, and ns devices to list available targets.[72][73][74]
The build process in NativeScript involves several automated steps to transform JavaScript or TypeScript code into native platform binaries. It begins with transpilation of TypeScript to JavaScript if needed, followed by bundling of scripts, assets, and dependencies using Webpack to create efficient runtime packages. These are then integrated with native platform tools—Gradle for Android and Xcode for iOS—to compile the final APK or IPA files, incorporating UI declarations and API bindings without intermediate web views. Live reload, activated via the --watch flag in ns run, monitors file changes and incrementally rebuilds and redeploys, significantly speeding up iteration.[73][75][76]
Setting up the development environment requires platform-specific tools. For Android development on Windows, macOS, or Linux, Android Studio and the Java Development Kit (JDK) are essential, along with enabling USB debugging on physical devices via ADB. iOS development mandates macOS with Xcode installed, an Apple Developer account for signing, and device provisioning profiles for testing on real hardware; iOS builds are not supported on Windows or Linux without remote services. To bypass local setup limitations, developers can leverage cloud-based build services through CLI extensions, allowing remote compilation for platforms like iOS from non-Mac environments.[77][78][79]
In recent updates, NativeScript CLI version 8.9, released in February 2025, introduced enhancements including preview support for Node-API engines like Hermes and QuickJS, which streamline native module integration during builds, and a new ns widget ios command for generating iOS widget extensions compatible with Home Screen and Lock Screen features. As of July 2025, the CLI has been updated to version 8.9.3 with minor fixes and improvements. These improvements expand CLI capabilities for modern app architectures while maintaining backward compatibility.[4][80]
Plugins and Community Modules
NativeScript's plugin system is built on NPM, allowing developers to extend the framework's core capabilities by integrating native device features and third-party services through reusable modules. These plugins leverage NativeScript's direct API access to provide JavaScript/TypeScript bindings for platform-specific functionalities that are not included in the base framework. For instance, the@nativescript/camera plugin enables access to device camera hardware for capturing photos and videos, while nativescript-sqlite facilitates local database storage using SQLite on both Android and iOS.[81][82]
The community contributes a vast array of modules available via the NativeScript Marketplace, with over 200 plugins covering diverse areas such as mapping, payments, and connectivity. Examples include @nativescript/google-maps for integrating interactive maps with markers and user interactions, Stripe plugins like nativescript-stripe for handling in-app payments, and nativescript-bluetooth for low-energy device communication. These modules are discoverable on the marketplace and can be installed directly from NPM, enhancing app development without requiring custom native code.[83][84]
Installation of plugins is streamlined through NPM commands, such as npm install @nativescript/camera, which automatically handles dependencies and generates JavaScript bindings for the underlying native libraries via NativeScript's auto-binding mechanism. This process ensures seamless integration into projects, with the framework resolving platform-specific implementations at build time. Previously, the tns plugin add command was used, but NPM has become the standard for consistency with modern JavaScript workflows.[85]
Since the 2020 transition from Progress Software to community governance, plugin maintenance has been handled through a vetting process led by the NativeScript Technical Steering Committee (TSC), ensuring quality, compatibility, and updates across framework versions. Community contributions are encouraged via GitHub repositories, with automated tools in plugin workspaces powered by Nx facilitating scalable development and migration. This structure has sustained an active ecosystem, with the TSC providing oversight for official plugins while allowing broader community modules to thrive.[11][58]