![]() When we’re ready to roll out a new version of Wagon.app, we use an automated deployment approach built on GitHub and CircleCI. The splash page swaps its content for the UI, creating a seamless transition into the full application.Once the UI is ready, it notifies the splash page via Electron’s IPC API.The splash page uses Electron’s tag to load our remote assets and start the JS app in the background while the Wagon logo rolls (some say dances!) on screen.The renderer immediately displays a splash.html page that is shipped with the Wagon.app bundle.It loads configuration files, starts background tasks, and opens a renderer to load the latest UI. On app start, the main Node process runs our JS App Loader.Here’s how Wagon ensures a smooth app launch experience: However, it can take a few seconds for these assets to load and we want an immediate cue that Wagon is working. Our static assets are hosted on CloudFront, so we can update the UI without requiring users to redownload the whole application. Node’s and Electron’s rich JS APIs made porting from MacGap easy, and we’ve added features that would otherwise only be possible in a native application (like custom menus and dialogs). Electron differs from other web-view containers by using Node.js (via io.js) as its entry point: when an Electron app starts, execution begins in a JS program included in the app bundle, which can open windows and interact with the host OS. Migrating from MacGap to Electron was straightforward, as Electron’s excellent documentation has instructions on rebranding, packaging, and distribution–we got a prototype up and running on a Friday afternoon. Electron is evolving quickly and openly, supported by its vibrant community, active development, public Slack room, and commercial backing. ![]() Auto-update, which originally motivated us to try Electron, is easy to set up and simplifies shipping new versions. Wagon uses Electron to bundle native and web technologiesĮlectron is based on Chromium, runs on multiple platforms, and comes packaged with useful features like desktop notifications, custom keyboard shortcuts, and native menus. In searching for a full-featured, cross-platform web-view container, we found Electron. We briefly considered Mac-specific update mechanisms but it became clear we needed to replace MacGap. We frequently ship new versions of both the JS and compiled Haskell, and it was painful for our users to manually download and reinstall the application. As more people used Wagon, we wanted to update the code silently in the background, deploy to Windows and Linux, and move away from WebKit (we <3 Chromium’s dev tools!). We soon shipped our first Mac app: a download-able, double-click-able version using MacGap. The earliest alpha of Wagon was a command line program that powered a browser app available at localhost. We want a capable desktop application with the ease of developing for the web. Our CTO Mike described Wagon’s technical architecture: a Javascript application for user experience along with a native process for database connections and streaming data computation. Electron was carved out of the Atom editor project and lets us deploy web UIs to the desktop. Early adopters including Slack, Atom, Quip, Visual Studio, Spotify, MapBox, Front, and Nylas have found ways to weave these once unrelated approaches.Īt Wagon, we’re using Github’s Electron (previously “Atom-Shell”) as our underlying app framework. The standard web browser won’t suffice, so what should we do?Īs many companies are discovering, mixing web and native technologies is very compelling. Unfortunately, browsers can’t connect directly to databases and aren’t optimized for processing millions of data results. Our users want Wagon to connect securely to their database and analyze large amounts of data, while being easy to setup and always up to date. While building Wagon, we’ve encountered a few engineering challenges that aren’t easily solved in the browser.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |