title: Performance-wise: Is a WPF application better than an Electron one coded wisely?
body: <p>Recently, I have been reading about <strong>Electron</strong> and I got curious about its potential when compared to something already established in the market of building <code>Windows 7</code> desktop applications (i.e., <strong>WPF</strong>).</p>
  
  <p>So far, I noticed that those who lean towards <strong>Electron</strong> discuss the fact that it provides:</p>
  
  <ul>
  <li><em>fast-development cycles</em>: one familiar with <code>HTML5</code>, <code>CSS3</code>, <code>JS</code>, and some <code>Node.js</code>, is all set to jump right into building a desktop application.</li>
  <li><em>cross-platform compatibility</em>: being based on <code>Chromium</code> and <code>Node.js</code>, both cross-platform, the application can run anywhere where these two are supported.</li>
  <li><em>beautiful and interactive <code>GUI</code> design</em>: the combination of <code>HTML5</code>, <code>CSS3</code> and <code>JS</code> has proven what is capable of achieving over the years.</li>
  <li><em>straightforward and cost-effective web recycling</em>: a web application can be relatively easy converted to a desktop application by the same developers who created it in the first place (i.e., saving costs).</li>
  </ul>
  
  <p>When it comes to <strong>WPF</strong>, its supporters discuss the following favoring arguments:</p>
  
  <ul>
  <li><em>access to native APIs</em>: <strong>WPF</strong> fits well into the <code>.NET</code> framework giving the developer access to all native <code>Windows</code> functionality.</li>
  <li><em>powerful <code>XAML</code> markup language</em>: it is argued that the <code>XAML</code> allows efficient rendering of sophisticated <code>UI</code> elements, supports two-way data binding, and knowing it may be useful in other contexts (i.e., with appropriate adjustments, e.g., Android development).</li>
  <li><em>high-performance and memory-efficiency</em>: mainly due to the compiled nature of the language and, perhaps, other <code>JIT</code> idiosyncrasies.</li>
  </ul>
  
  <p>If we take these arguments separately, we can agree that both technologies are respectable. However, when you ask developers for help choosing the right framework for your the project, things get a bit biased. I assume that the bias may be either because the questions are too unspecific, or because some are more familiar with one framework than the other and, thus, the comfort zone kicks in.  </p>
  
  <p>Hence, keeping in mind that both are just means to an end, <strong>and not life philosophies</strong>, when compared, it usually boils down to the following ideas. Please note that these are not my ideas, but what I collected from various discussion groups around the web.</p>
  
  <ul>
  <li><code>DOM</code> manipulation is an expensive operation, whereas <code>XAML</code> rendering is blazingly fast.</li>
  <li><strong>Electron</strong> gives you access to just a few native <code>OS</code> functionality through its <code>APIs</code>, whereas <strong>WPF</strong> gives you access to all since it lives on the <code>.NET</code>.</li>
  <li><strong>Electron</strong> is slower compared to <strong>WPF</strong> because <code>JS</code> is interpreted, whereas, say <code>C#</code>, is compiled.</li>
  <li><strong>WPF</strong> works well with the <code>MVVM</code> pattern, whereas something similar is harder to achieve in <strong>Electron</strong>.</li>
  <li><strong>Electron</strong> is fast to get started with, whereas <strong>WPF</strong> has a steep learning curve (but it looks more <em>professional</em> they say).</li>
  <li><strong>Electron</strong> is cross-platform, whereas <strong>WPF</strong> is tied to the <code>.NET</code>. Not sure whether the <code>Xamarin</code>/ <code>.NET Core</code> was taken into account.</li>
  <li><strong>Electron</strong> application size is large as it has to ship with <code>Chromium</code> and <code>Node.js</code> to accomplish its goals.</li>
  <li><strong>WPF</strong> is less actively improved compared to <strong>Electron</strong> (i.e., <strong>Electron</strong> is an open-source project).</li>
  <li><strong>Electron</strong> handles the application updates for you, whereas the same thing requires more work in <strong>WPF</strong>.</li>
  </ul>
  
  <p>On one side, it seems that software engineers (i.e., especially those who work in the corporate world) tend to favor <strong>WPF</strong>. On the other side, web developers are excited about what <strong>Electron</strong> brings to the table. In my opinion, this is bias, and the fact that you work more with a technology than the other does not say anything about how suitable the technology is in itself. </p>
  
  <p>Therefore, to avoid this bias and, perhaps, other nagging answers, I want to provide you with the following case study. </p>
  
  <p>Let us say one is interested in building a <code>Windows 7</code> desktop application with <strong>Electron</strong>. The goal of the application is to allow the users to configure and run an extremely computational-intensive statistical analysis on a large <code>XLSX</code> file (i.e., <code>1e5</code> rows). In short, the user fills in a form, a special syntax file is generated (i.e., <code>json</code>, <code>xml</code>, or <code>txt</code>), the application reads that file and performs the analysis with the parameters specified there. At the end, a <code>pdf</code> file with graphs and tables is provided to the user. Now, let us assume the following about this project:</p>
  
  <ul>
  <li>the <code>DOM</code> is not directly manipulated. Rather, <code>Vue.js</code> or <code>React</code> are used because they implement a virtual <code>DOM</code> which is faster.</li>
  <li>the application does not need access to all the native <code>OS</code> functionality. The application only requires to read/ write files to disk and, perhaps, send some notifications.</li>
  <li>because <code>JS</code> is too slow to run the statistical analysis, a <code>C++</code>-based <code>Node.js</code> addon is written and called from <code>JS</code>. Behind the scenes, the <code>C++</code> code constructs the objects and makes the computations. At the end, the resulting matrices and vectors are be exposed to the <code>JS</code>. </li>
  <li>the developer cares to structure the application properly and separates the concerns as much as possible. To avoid unnecessary renderings, <code>Vue.js</code> or <code>React</code> components may be used.</li>
  <li>the developer does not consider problematic the additional <code>~50MB</code> in size added to the package by the Chromium and <code>Node.js</code>.</li>
  <li>the application is hosted on a central repository and the updates are pushed to the end users.</li>
  </ul>
  
  <p><strong>Keeping these assumptions in mind, my questions to you are:</strong></p>
  
  <ol>
  <li>To what extent is a <strong>WPF</strong> application more efficient than an <strong>Electron</strong> application, given that the heavy computations are implemented in <code>C++</code> or <code>C#</code> and packaged as a <code>.dll</code>? If it is, what causes these differences?</li>
  <li>Is <code>XAML</code> more efficient for rendering interactive <code>UI</code> elements compared to <code>Vue.js</code> or <code>React</code> in combination with <code>HTML5</code> and <code>CSS3</code>?</li>
  </ol>
  
  <p>Disclaimer: I am bias towards <strong>Electron</strong> because I think it enables me to build the <code>GUI</code> faster than <code>XAML</code>. I may be wrong because I am not entirely familiar with what <code>XAML</code> has to offer.</p>
  
  <hr>
  
  <p><strong><em>Note:</strong> Please do not mark this question as inappropriate. It is specific enough and well documented, and it might help others facing the same decision.</em></p>
  
  <hr>
  
  <p><strong>Edit 1.</strong> Please provide arguments for downvoting/ flagging the question for closing. Perhaps, if you offer some constructive feedback the question can be improved.</p>