What’s the Difference between Meteor and Electron?

Zack Wallace
Share

What’s the Difference between Meteor and Electron? And which should I learn and use?

Meteor and Electron are both cross-platform frameworks for developing apps using web languages and technologies such as JavaScript, Node, HTML, and CSS.

For a while I assumed they did the same things and directly competed with each other. This was based on the language on their own websites. Electron says “Build cross platform desktop apps with JavaScript, HTML, and CSS”. Meteor, on the other hand, says “Meteor is an open source platform for web, mobile, and desktop.”

I started researching which is “best” to create a “desktop” app with, and which I should spend time learning. When I tried to find the main differences between them, I was surprised there wasn’t much info comparing the two.

The confusion is in them both claiming to create “desktop” apps. I don’t know why Meteor claims this, maybe someone can explain?

Let’s go over exactly what each is for.

A lecturer with Electron and Meteor subtly on the board behind him

Meteor

Meteor logo

Meteor is for building JavaScript apps for web, mobile, and desktop. You use it by installing a program to your operating system and running commands on your projects.

It is a full-stack JavaScript platform including the API, build tools, and curated packages from Node.js and the general JavaScript community. Meteor itself includes Node.js, or you can have Node installed locally as well.

To get started with Meteor, head to the website and install the program for your operating system; Windows, Mac, or Linux. You then create an app with meteor create myapp and run meteor which starts a local server for development. If you’d like to know more of the specifics, see the Meteor guide.

Meteor has a package library called “Atmosphere” which contains libraries specific to Meteor. Some libraries can depend on other Atmosphere libraries. Meteor can also use npm. In the future, it’s likely that all packages will be on npm instead. Completed Meteor apps can themselves also become a library that can be included in other projects.

When the project is ready, you can deploy the app. Since Meteor creates a Node-based app, you need Node hosting. Meteor recommends their own hosting service called Galaxy which is based on Amazon Web Services (AWS).

Many large Meteor apps today are hosted on Galaxy. Using it makes deploying a little easier and there is really nothing to laugh at about being based on AWS. You should be in good hands for scaling your app.

Use of Galaxy allows for easier logging, analytics, monitoring, updating and continuous integration, migrating, and staging tools. You don’t have to use Galaxy, but it would be highly recommended, if not just to reduce some complexity in hosting.

You can also deploy as an Android or iOS app. This requires some additional setup and tools in your dev environment, but you can add these and run emulators for testing. Meteor for Windows doesn’t support mobile builds. This ability is built on Cordova, which is itself a framework for turning web languages into mobile apps.

The big takeaway here is that even though the Meteor website says “Meteor is an open source platform for web, mobile, and desktop”, this does not actually mean it creates desktop apps! This is what confused me at first and perhaps others.
Meteor is for creating a “web app”, something that runs on a server and in the browser or iOS or Android app (with appropriate build tools). Meteor is a full stack framework which has both front-end and back-end modules and abilities. Other frameworks such as Ember, for example, are just for the front-end.

Meteor supports integration and use of the most popular JavaScript libraries and frameworks such as Angular and React.
It comes ready with deep integration of MongoDB out of the box on the server side, and something called MiniMongo on the client side. Syncing the two DBs is a conversation about pub/sub (publish and subscribe) features. It is extremely easy to create a dataset and begin using it right away almost as easy as creating and using an array.

For examples of sites built on Meteor, check out their showcase, or head to BuiltWithMeteor. As one example, here is something of a Trello clone, Kanban board called Wekan.

Electron

Electron logo

Electron is for building cross-platform apps that run as desktop applications. You also program with JavaScript, HTML, CSS and various Node libraries, but it compiles as a native desktop app for Windows, Linux, and Mac. Something that Meteor does not do out of the box.

Electron was created by Github for their Atom editor, and has since been used by the likes of Microsoft and Facebook.

The interface container is handled by Chromium and uses a bundled Node.JS server to “serve” the app within the container. It’s a self-contained web server running in a frame that isn’t much different than a tab in a Chrome browser window.

All the typical tools can be used like React, Angular, and Node libraries. You won’t be running PHP or Ruby or Java in there though!

Via Chromium, your apps can access certain native OS features like dialog boxes, menus, and notifications. Windows apps can be packaged and deployed using an installer program. You have file system access, and can store data in many different ways.

Programs can be built to include self-updating, crash reporting, and profiling/debugging.

If you want to see Electron in action, well you are probably already using it. Many apps run on it, such as Slack, Visual Studio Code, Nylas N1, Brave Browser, and Atom editor. See many more here.

Visual Studio Code built in Electron

Compiled apps for Mac need at least version 10.9 64bit. For Windows you need Windows 7 and above and they can work with both 32bit and 64bit but not ARM versions. Linux depends on libraries, but for sure Ubuntu 12.04 (and later), as well as Fedora 21 and Debian 8 are verified to work.

For storage there are a lot of options. The smallest may be LocalStorage but it’s very small, measured in megabytes. A good “next size up” JSON store (useful for settings and state) is called electron-json-storage. Moving up from there you can look at Pouchdb but some have argued performance suffers after so many thousands of rows, around 50k and up.

Perhaps the largest storage option is IndexedDB which is limited in size to a 3rd of available hard drive space. There are various adapters and APIs for managing IndexedDB such as Dexie.js. You can even find alternative local database stores such as NeDB, inspired from MongoDB.

So the Main Difference is…

Electron compiles desktop applications for Windows, Linux, and Mac. Meteor creates a full stack web application and potentially iOS and Android apps via Cordova.

One obvious question we might ask is: can I create a Meteor app, but run it as an Electron container so I get all the benefits of both?

The answer is yes.

The caveat is that there doesn’t seem to be a robust, accepted way to do it. There are many methods, as a quick Google search will reveal. The best place to start is the Meteor forums. You may come across Electrometeor, a project for running Meteor in Electron, but commits are a year and two years old. I don’t know if still works with the latest Meteor version (as of this writing, version 1.4).

Combining the two is definitely on my own bucket list!

The end result of combining them is that you have an app that will run on the web, compile to iOS and Android apps, and run on multi-platform desktops. All the different deployments will share a majority of the same code base.

The Others

It goes without saying that there are alternatives to both of these frameworks.

Alternatives to Electron are slim, with the main competitor being NW.js, formerly “node-webkit”. They are both based on the V8 Chromium JS engine but Electron does just squeak ahead in features.

There are other ways to package apps for multiple platforms, but Electron is for HTML, JS, CSS, and Node. Xamarin, for example, does the same but using C#.

The best competition for Meteor is probably going to be Express which is a framework also built for Node.js. Supplementing Express would be Feathers, which adds more modules and features for building real-time apps and rounding out the features of Express.

The competition is so tight that I would seriously consider researching Meteor against Express and Feathers before making a choice for one or the other. Express has gained a lot of popularity and makes bootstrapping a Node project pretty quick. Feathers adds real time features and many helpful modules to work with Express hand-in-hand.

Conclusion

Use Meteor if you want a local dev tool to create and deploy your JavaScript web app online. Make use of Galaxy hosting and all the tools it provides so your app can scale and be monitored properly, saving on sysadmin chores.

Meteor is a framework for developing, testing, profiling, deploying, updating, and monitoring a rich web app. And then with Cordova, you can package it up for phone app stores and deploy to iOS and Android. After that, you can think about packaging the app up with Electron to create a desktop experience on Windows, Mac, and Linux.

Meteor isn’t only for small apps. This fascinating presentation titled “3,000 Hours Into Meteor” on how Qualia built their system on Meteor (with 10s of thousands of pieces of related data and a very data-intensive interface) is worth a watch!

Use Electron if you’re interested only in creating cross-platform desktop applications that can work offline as well as online, and want to build with web languages like JavaScript, HTML, CSS, Node, and npm libraries. Electron is, at the heart, just a Node server running in a Chromium container with JavaScript V8 engine. Theoretically, you can run any old Node app in there, built with Meteor or otherwise.

If you build you app firstly with Electron and then want to deploy to the web, you’ll have to deconstruct it to the essential Node project without any Electron API being used. It may be easier to build a web app first, and THEN think about packaging and making use of Electron for deploying to desktops later.

I hope that helps you decide whether to use Meteor and/or Electron in your next project! I suggest being familiar with both!

Let us know in the comments if you want to see more articles covering Electron or Meteor specifically.