Apache Cordova vs Capacitor

Overview

Apache Cordova

Stacks686

Followers892

Votes218

GitHub Stars955

Forks345

Capacitor

Stacks287

Followers326

Votes2

GitHub Stars14.2K

Forks1.1K

Apache Cordova vs Capacitor: What are the differences?

Apache Cordova and Capacitor are both frameworks for building cross-platform mobile applications using web technologies. Let's explore the key differences between the two.

Cross-platform support: Apache Cordova is primarily focused on providing cross-platform support by packaging web applications into native mobile apps using WebView. It allows developers to write code once and deploy it across multiple platforms like iOS, Android, and Windows Phone. Capacitor, on the other hand, is built on top of Cordova but provides additional cross-platform support for features like InAppBrowser and Camera that are not available in Cordova by default.
Plugin architecture: Cordova follows a plugin-based architecture which allows developers to extend the functionality of their applications by adding plugins. These plugins provide access to native device features that are not available through web technologies alone. Capacitor also follows a similar plugin architecture but with a different approach. Instead of relying on Cordova plugins, Capacitor uses its own set of plugins which are built specifically for Capacitor and offer better performance and reliability.
Modern development workflow: Capacitor offers a more modern development workflow compared to Cordova. It allows developers to write modern TypeScript or ECMAScript 6+ code, use modern JavaScript frameworks like React or Angular, and leverage modern tooling such as webpack or Babel. Cordova, on the other hand, has a more mature ecosystem but is based on older web technologies and may require additional setup or configuration for modern development practices.
Native API access: Capacitor provides direct access to Native APIs, allowing developers to call native functionality directly from their JavaScript code. This eliminates the need for plugins in many cases and provides a more seamless integration with native platform features. Cordova, on the other hand, relies heavily on plugins for accessing native functionality, which may introduce some overhead and dependencies on third-party plugins.
Community and ecosystem: Cordova has been around for a longer time and has a larger community and ecosystem compared to Capacitor. This means that Cordova has a vast number of plugins and resources available for developers, making it easier to find solutions and add new features to applications. Capacitor, being relatively newer, has a smaller but growing community and may have fewer resources available compared to Cordova.
Migration from Cordova to Capacitor: Capacitor provides a migration tool that allows developers to easily migrate their existing Cordova projects to Capacitor. This makes it easier for developers to switch from Cordova to Capacitor without having to rewrite their code from scratch. Cordova, on the other hand, does not provide any official migration path to Capacitor, which may require developers to manually refactor their code when transitioning.

In summary, Apache Cordova is a well-established choice for cross-platform development, while Capacitor, with its focus on native features and performance, provides a modern alternative for building mobile applications using web technologies.

Share your Stack

Help developers discover the tools you use. Get visibility for your team's tech choices and contribute to the community's knowledge.

View Docs

CLI (Node.js)

Manual

Advice on Apache Cordova, Capacitor

Aleksandr

Contract Software Engineer - Microsoft at Microsoft-365

Dec 23, 2019

Review

What is `Proguard`?

ProGuard is the most popular optimizer for Java bytecode. It makes your Java and Android applications up to 90% smaller and up to 20% faster. ProGuard also provides minimal protection against reverse engineering by obfuscating the names of classes, fields and methods.

How to use it in `Cordova` app?

I didn't find any plugins for it. So I've implemented it by myself and shared it on GitHub.

Feel free to use!

119k views119k

Comments

Aleksandr

Contract Software Engineer - Microsoft at Microsoft-365

Dec 23, 2019

Needs advice

I've done some Hybrid Mobile apps with both technologies Apache Cordova and React Native and described my experience in my blog.

In a few words, I would suggest to use each technology in accordance what what is your current code base and what do you want to achieve.

React Native is a great option if you need that extra edge in performance with multi-threading and native UI rendering. Or you already have a web app based on React which you want to port to mobile.

On the other hand, if you have an existing web application code and you want to reuse some or all, including the ability to use web third-party libraries, then Cordova is the best option.

429k views429k

Comments

Detailed Comparison

Apache Cordova	Capacitor
Apache Cordova is a set of device APIs that allow a mobile app developer to access native device function such as the camera or accelerometer from JavaScript. Combined with a UI framework such as jQuery Mobile or Dojo Mobile or Sencha Touch, this allows a smartphone app to be developed with just HTML, CSS, and JavaScript.	Invoke Native SDKs on iOS, Android, Electron, and the Web with one code base. Optimized for Ionic Framework apps, or use with any web app framework.`
Cross-platform (CLI) workflow;Platform-centered workflow;Hundreds of plugins	Build web apps that run equally well on iOS, Android, Electron, and as Progressive Web Apps; Access the full Native SDK on each platform, and easily deploy to App Stores (and the web!); It provides native functionality for web apps, and is optimized for Ionic Framework; Build apps with standardized web technologies that will work for decades, and easily reach users on the app stores and the mobile web; Easily add custom native functionality with a simple Plugin API, or use existing Cordova plugins with our compatibility layer; Open source
Statistics
GitHub Stars 955	GitHub Stars 14.2K
GitHub Forks 345	GitHub Forks 1.1K
Stacks 686	Stacks 287
Followers 892	Followers 326
Votes 218	Votes 2
Pros & Cons
Pros 48 Lots of plugins 35 JavaScript 26 Great community 25 Easy Development 18 Easy to learn Cons 2 No native performance 1 Hard to install 0 Hard to install	Pros 1 Modern 1 Full compatible with ios
Integrations
No integrations available	Electron Ionic iOS Android OS

What are some alternatives to Apache Cordova, Capacitor?

Ionic

Free and open source, Ionic offers a library of mobile and desktop-optimized HTML, CSS and JS components for building highly interactive apps. Use with Angular, React, Vue, or plain JavaScript.

Flutter

Flutter is a mobile app SDK to help developers and designers build modern mobile apps for iOS and Android.

React Native

React Native enables you to build world-class application experiences on native platforms using a consistent developer experience based on JavaScript and React. The focus of React Native is on developer efficiency across all the platforms you care about - learn once, write anywhere. Facebook uses React Native in multiple production apps and will continue investing in React Native.

Xamarin

Xamarin’s Mono-based products enable .NET developers to use their existing code, libraries and tools (including Visual Studio*), as well as skills in .NET and the C# programming language, to create mobile applications for the industry’s most widely-used mobile devices, including Android-based smartphones and tablets, iPhone, iPad and iPod Touch.

NativeScript

NativeScript enables developers to build native apps for iOS, Android and Windows Universal while sharing the application code across the platforms. When building the application UI, developers use our libraries, which abstract the differences between the native platforms.

Framework7

It is a free and open source mobile HTML framework to develop hybrid mobile apps or web apps with iOS native look and feel. All you need to make it work is a simple HTML layout and attached framework's CSS and JS files.

Qt

Qt, a leading cross-platform application and UI framework. With Qt, you can develop applications once and deploy to leading desktop, embedded & mobile targets.

PhoneGap

PhoneGap is a web platform that exposes native mobile device apis and data to JavaScript. PhoneGap is a distribution of Apache Cordova. PhoneGap allows you to use standard web technologies such as HTML5, CSS3, and JavaScript for cross-platform development, avoiding each mobile platforms' native development language. Applications execute within wrappers targeted to each platform, and rely on standards-compliant API bindings to access each device's sensors, data, and network status.

Expo

It is a framework and a platform for universal React applications. It is a set of tools and services built around React Native and native platforms that help you develop, build, deploy, and quickly iterate on iOS, Android, and web apps.

Vue Native

Vue Native is a mobile framework to build truly native mobile app using Vue.js. Its is designed to connect React Native and Vue.js. Vue Native is a wrapper around React Native APIs, which allows you to use Vue.js and compose rich mobile User Interface.

Related Comparisons

Apache Cordova vs Capacitor: What are the differences?

Apache Cordova and Capacitor are both frameworks for building cross-platform mobile applications using web technologies. Let's explore the key differences between the two.

Cross-platform support: Apache Cordova is primarily focused on providing cross-platform support by packaging web applications into native mobile apps using WebView. It allows developers to write code once and deploy it across multiple platforms like iOS, Android, and Windows Phone. Capacitor, on the other hand, is built on top of Cordova but provides additional cross-platform support for features like InAppBrowser and Camera that are not available in Cordova by default.
Plugin architecture: Cordova follows a plugin-based architecture which allows developers to extend the functionality of their applications by adding plugins. These plugins provide access to native device features that are not available through web technologies alone. Capacitor also follows a similar plugin architecture but with a different approach. Instead of relying on Cordova plugins, Capacitor uses its own set of plugins which are built specifically for Capacitor and offer better performance and reliability.
Modern development workflow: Capacitor offers a more modern development workflow compared to Cordova. It allows developers to write modern TypeScript or ECMAScript 6+ code, use modern JavaScript frameworks like React or Angular, and leverage modern tooling such as webpack or Babel. Cordova, on the other hand, has a more mature ecosystem but is based on older web technologies and may require additional setup or configuration for modern development practices.
Native API access: Capacitor provides direct access to Native APIs, allowing developers to call native functionality directly from their JavaScript code. This eliminates the need for plugins in many cases and provides a more seamless integration with native platform features. Cordova, on the other hand, relies heavily on plugins for accessing native functionality, which may introduce some overhead and dependencies on third-party plugins.
Community and ecosystem: Cordova has been around for a longer time and has a larger community and ecosystem compared to Capacitor. This means that Cordova has a vast number of plugins and resources available for developers, making it easier to find solutions and add new features to applications. Capacitor, being relatively newer, has a smaller but growing community and may have fewer resources available compared to Cordova.
Migration from Cordova to Capacitor: Capacitor provides a migration tool that allows developers to easily migrate their existing Cordova projects to Capacitor. This makes it easier for developers to switch from Cordova to Capacitor without having to rewrite their code from scratch. Cordova, on the other hand, does not provide any official migration path to Capacitor, which may require developers to manually refactor their code when transitioning.

Apache Cordova vs Capacitor

Overview