Arm Community
Arm Community
  • Site
  • User
  • Site
  • Search
  • User
  • Groups
    • Research Collaboration and Enablement
    • DesignStart
    • Education Hub
    • Innovation
    • Open Source Software and Platforms
  • Forums
    • AI and ML forum
    • Architectures and Processors forum
    • Arm Development Platforms forum
    • Arm Development Studio forum
    • Arm Virtual Hardware forum
    • Automotive forum
    • Compilers and Libraries forum
    • Graphics, Gaming, and VR forum
    • High Performance Computing (HPC) forum
    • Infrastructure Solutions forum
    • Internet of Things (IoT) forum
    • Keil forum
    • Morello Forum
    • Operating Systems forum
    • SoC Design and Simulation forum
    • 中文社区论区
  • Blogs
    • AI and ML blog
    • Announcements
    • Architectures and Processors blog
    • Automotive blog
    • Graphics, Gaming, and VR blog
    • High Performance Computing (HPC) blog
    • Infrastructure Solutions blog
    • Innovation blog
    • Internet of Things (IoT) blog
    • Operating Systems blog
    • Research Articles
    • SoC Design and Simulation blog
    • Smart Homes
    • Tools, Software and IDEs blog
    • Works on Arm blog
    • 中文社区博客
  • Support
    • Arm Support Services
    • Documentation
    • Downloads
    • Training
    • Arm Approved program
    • Arm Design Reviews
  • Community Help
  • More
  • Cancel
Arm Community blogs
Arm Community blogs
Architectures and Processors blog Learning from Tweeten: Porting Electron Apps to Native Arm64 for Windows on Arm
  • Blogs
  • Mentions
  • Sub-Groups
  • Tags
  • Jump...
  • Cancel
More blogs in Arm Community blogs
  • AI and ML blog

  • Announcements

  • Architectures and Processors blog

  • Automotive blog

  • Embedded blog

  • Graphics, Gaming, and VR blog

  • High Performance Computing (HPC) blog

  • Infrastructure Solutions blog

  • Internet of Things (IoT) blog

  • Operating Systems blog

  • SoC Design and Simulation blog

  • Tools, Software and IDEs blog

Tell us what you think
Tags
  • Windows 10
  • laptop
  • Application developers
  • Arm64
  • Windows
Actions
  • RSS
  • More
  • Cancel
Related blog posts
Related forum threads

Learning from Tweeten: Porting Electron Apps to Native Arm64 for Windows on Arm

Ben Clark
Ben Clark
January 25, 2021
5 minute read time.

Windows on Arm has really gathered momentum and the ecosystem is continuing to grow. It now has the supporting tools to make it easy to port Windows apps to run natively.

With the Electron framework ready for Arm, there are a few simple steps to get your code running natively. Electron is an open-source software framework for developing cross-platform GUI applications using web technology. With the Electron framework, but also through more libraries, open-source software projects and other dependencies moving over to Arm64, you can now jump that last hurdle to fast, efficient native code.

Let us look at an example of how one developer ported their Electron app to native Arm64.

Tweeten on a laptop

Tweeten

Tweeten is a popular free Twitter client. It is a TweetDeck-based app and in 2017 when TweetDeck stopped having its own Windows client Tweeten quickly filled the gap.

Tweeten is electron-based, and primarily JavaScript. Other popular electron-based apps include Slack, Visual Studio Code, WhatsApp, Skype, and Discord. The platform is well set up for being cross-platform, and with Arm’s help, it has been great for Windows on Arm apps too. Especially since 7.0 came out last year.

Tweeten’s Windows version was built against x86_64. Windows on Arm has x86 emulation, but non-native 64-bit apps do not run, so Tweeten was missing platform entirely.

const electron = require('electron')

Electron version & dependencies

The first and biggest task was updating Electron and the accompanying dependencies. For any Windows on Arm port, dependencies will be the major hurdle. In Tweeten’s case, this mainly involved updating from Electron 3 to Electron 7 and all the accompanying libraries with it.

Once updated to Electron 7 and up-to-date APIs, Arm 64 support was there.

And with Electron doing the multi-platform work for you, converting your code is easy.

Building

Mostly when you go to build your code, it is a case of setting the target to Arm64, compiling and then you are done.

As Tweeten was one of the first Electron apps to be ported to Windows on Arm, they hit one or two minor issues when they first compiled. To make sure others do not hit these issues, they contributed to the Electron documentation, so it is now updated and straightforward for everyone else.

Once built, Tweeten was ready to try on the Microsoft Surface Pro X for testing. As the Electron code was JavaScript, the developer could easily see and tweak any last minor changes without Remote Debugging.

Remote Debugging is available through Visual Studio 2019, or Visual Studio 2017 if you download the 15.9 update and then the Arm64 toolset with it. Visual Studio Code can run on a Windows on Arm device now so you can do local debugging. However, depending on the language you use, the required libraries or compilers may still be being ported across.

Installer and deployment

The next step was how to deploy the app to users. At the time, Tweeten used the NSIS installer and it did not support Windows on Arm properly. Shortly afterwards, NSIS was fixed, so now if you use the latest NSIS release (3.06) it works.

But Tweeten needed to release before the NSIS fix, so the solution chosen was the Windows Store. The Store allows easy deployment for different architectures, so is perfect for adding a Windows on Arm version.

However, when initially uploading Tweeten to the Store, there were ‘package is invalid’ errors. After a bit of research, this turned out to be an issue with the minimum Windows 10 version requirements.

So Tweeten was updated to have a minimum version of 1809 (10.0 Build 17763). This solved the problem and allowed Windows Store deployment. Native Arm64 Tweeten was then released.

Emulation comparisons

For the benefit of comparison, and because it was not too much effort, a Win32 version of Tweeten was created.

Often the difference between emulation and native will not be immediately obvious, and most of the time this was the case with Tweeten. However, looking at the CPU usage revealed significant savings that would add up to important differences in battery life, and performance if there are multiple hungry apps running.

For Tweeten, during start-up the native version of the app used 20% CPU versus the 30% used by the win32 emulation. And when actively using the app, the CPU usage was 4% on the native app versus 7% when running under emulation. So a CPU performance improvement of between 33% and 42% is delivered, along with the battery savings of not doing that extra work.

When moving the Tweeten window, and especially re-sizing it, there is also a ‘smoother’ feel, but generally the emulation is impressive in how well it copes from a user perspective. From a system point of view, however, those CPU savings are important, especially for battery life and if you are running other CPU-hungry apps.

Conclusion

As you have seen through this example, porting your Electron app to Windows on Arm is generally easy. There can be some issues with dependencies and libraries, but more of them are producing Windows on Arm versions. Many open-source projects are already compatible or may not require much effort to get them going, if they are a dependency.

And once the dependencies are sorted, it is easy from there. Target Arm64, build, and deploy.

Indeed, after porting Tweeten, the developer looked at another very popular Electron app and was able to port it in about an hour.

So, it is do-able and worth it for the performance improvements.

Learn more

The following resources provide more Windows on Arm and Electron information:

  • Porting Apps to Windows on Arm
  • Arm Windows on Arm Documentation
  • Electron Windows on Arm Documentation
  • Microsoft Windows on Arm Documentation
  • Electron and Electron’s github

Learn more about Windows on Arm

Sign up to the Arm DevSummit technical sessions where you will learn more about developing, deploying and debugging for Windows on Arm .

Sign up to Arm DevSummit

Anonymous
Architectures and Processors blog
  • Optimizing TIFF image processing using AARCH64 (64-bit) Neon

    Ramin Zaghi
    Ramin Zaghi
    This guest blog shows how 64-bit Neon technology can be used to improve performance in image processing applications.
    • October 13, 2022
  • Arm A-Profile Architecture Developments 2022

    Martin Weidmann
    Martin Weidmann
    2022 additions to Arm A-Profile architecture covering Virtual Memory System Architecture, SME2 and mitigating some ROP attacks with Guarded Control Stack.
    • September 29, 2022
  • A closer look at Arm A-profile support for non-maskable interrupts

    Christoffer Dall
    Christoffer Dall
    Arm is adding support in both the CPU and Generic Interrupt Controller (GIC) architecture for NMIs. But what is an NMI? how does operating systems software use these features?
    • May 23, 2022