Need advice about which tool to choose?Ask the StackShare community!
Apache Cordova vs Vuetify: What are the differences?
Introduction
Apache Cordova and Vuetify are two popular frameworks used in web development. Below are the key differences between the two.
Platform Compatibility: Apache Cordova is primarily focused on creating cross-platform mobile applications using web technologies like HTML, CSS, and JavaScript, allowing developers to build apps for multiple platforms such as iOS, Android, and Windows. On the other hand, Vuetify is a Material Design component framework for Vue.js, used primarily for creating responsive web applications that work across different browsers and devices, focusing more on web app development rather than mobile app development.
Purpose: Apache Cordova is ideal for developers looking to create hybrid mobile applications that can be deployed on various platforms with a single codebase, making it easier to reach a broader audience. In contrast, Vuetify is more suitable for developers looking to build modern, visually appealing web applications with a consistent user interface, making it a popular choice for projects that require a polished design and strong user experience.
Development Community: Apache Cordova has a large and active community of developers who contribute to the framework's evolution, provide support, and share resources to help others in building mobile apps. On the other hand, Vuetify, being a component framework for Vue.js, leverages the vibrant and growing Vue.js community, offering developers a wealth of resources, plugins, and support to enhance and streamline their web development projects.
Component Ecosystem: Vuetify provides a comprehensive set of pre-built and customizable Material Design components, such as buttons, cards, dialogs, and navigation drawers, enabling developers to quickly prototype and develop web applications with a consistent look and feel. Apache Cordova, while offering a plugin ecosystem for extending functionality, does not provide a predefined component library like Vuetify, requiring developers to create their UI components or use third-party libraries.
Technology Stack: Apache Cordova utilizes web technologies like HTML, CSS, and JavaScript to create mobile applications, enabling developers to leverage their existing web development skills and resources. In comparison, Vuetify is built on top of Vue.js, a progressive JavaScript framework, which promotes component-based development and provides features like reactive data binding and virtual DOM, enhancing the performance and scalability of web applications.
Learning Curve: Apache Cordova, with its focus on web technologies and cross-platform development, may have a steeper learning curve for beginners or developers unfamiliar with mobile app development practices. Vuetify, on the other hand, provides a straightforward and intuitive way to build responsive web applications using Material Design principles, making it easier for developers to create visually appealing interfaces without extensive knowledge of front-end development.
In Summary, Apache Cordova is suitable for cross-platform mobile app development, while Vuetify is ideal for building responsive web applications with Material Design components for a polished user interface.
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.
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 inCordova 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!
I'm building most projects using: Server: either Fastify (all projects going forward) or ExpressJS on Node.js (existing, previously) on the server side, and Client app: either Vuetify (currently) or Quasar Framework (going forward) on Vue.js with vuex on Electron for the UI to deliver both web-based and desktop applications for multiple platforms.
The direct support for Android and iOS in Quasar Framework will make it my go-to client UI platform for any new client-side or web work. On the server, I'll probably use Fastly for all my server work, unless I get into Go more in the future.
Update: The mobile support in Quasar is not a sufficiently compelling reason to move me from Vuetify. I have decided to stick with Vuetify for a UI for Vue, as it is richer in components and enables a really great-looking professional result. For mobile platforms, I will just use Cordova to wrap the Vue+Vuetify app for mobile, and Electron to wrap it for desktop platforms.
Pros of Apache Cordova
- Lots of plugins48
- JavaScript35
- Great community26
- Easy Development25
- Easy to learn18
- Cross platform15
- Open Source7
- Easy, fast, not buggy in my experience with my code6
- Lots of descendants; PhoneGap, Ionic, Intel XDA etc6
- Can use CSS34
- Rich HTML 54
- Easy debugging4
- HTML, CSS and JS3
- Fast and hot reload3
- Rich css ui3
- Use what you code in your browser3
- Need a light system2
- Native Web Technologies2
- Without extra tooling needed2
- One code base everywhere2
Pros of Vuetify
- Enables beauty for graphically challenged devs29
- Wide range of components and active development24
- Vue22
- New age components18
- Easy integration13
- Material Design11
- Open Source10
- Nuxt.js9
- Awesome Documentation6
- Awesome Component collection5
- Internationalization5
- Not tied to jQuery5
- Best use of vue slots you'll ever see4
- Not tied to jQuery2
- Treeshaking2
- Active Community2
- Responsiveness2
Sign up to add or upvote prosMake informed product decisions
Cons of Apache Cordova
- No native performance2
- Hard to install1
- Hard to install0
Cons of Vuetify
- It is heavy19
- Not Vue 3 Ready (Alpha-Version)3
Sign up to add or upvote consMake informed product decisions
What is Apache Cordova?
What is Vuetify?
Need advice about which tool to choose?Ask the StackShare community!
What companies use Vuetify?
Sign up to get full access to all the companiesMake informed product decisions
What tools integrate with Vuetify?
Sign up to get full access to all the tool integrationsMake informed product decisions
Blog Posts
+7