Benchmarking Unity performance in WebGL Edge vs Chrome vs

Benchmarking Unity performance in WebGL Edge vs Chrome vs. Firefox featured_winbuzzer

It´s already a well known fact that Microsoft Edge offers stunning rendering performance. Since our first benchmarks using early Spartan builds some time has passed. This is how Edge performs WebGL on the final version of Windows 10.

Earlier builds of Windows 10 indicated already that Edge (Spartan) might declassify Chrome and Firefox in Javascript performance. Especially WebGL rendering appeared to be lightning fast.

When we did our Benchmark Deep-Dive back in February, we relied on FishGL and Babylon.js to measure Edge´s (or Spartan´s how it was called back then) HTML5 WebGL performance.

browser-benchmarks-deepdive thumbnail 150

  –> Benchmark Deep-Dive: Microsoft Windows 10 Spartan Browser vs. IE11 vs. Google Chrome 41 vs. Mozilla Firefox 36

 

The version of Edge which gets shipped with the final RTM version of Windows 10 can now be tested more in detail. The demanding Unity WebGL Benchmark allows to test WebGL speed of Edge across different dimensions with numerical outputs and a total score.

Unity WebGL Benchmark is also compatible with the newest versions of Firefox and Chrome which allows for a nice detailed benchmark comparison.

Unity WebGL benchmark single test_winbuzzer

 

What is WebGL and why it matters

Stackoverflow has a good technical definition: “WebGL is a branch of OpenGL based on OpenGL Embedded Systems (ES). It is run in browsers through a <canvas> element after getting a context from said element. All calls are done through JavaScript.”

WebGL makes it possible to render interactive 2D and 3D graphics without any using plug-ins. For that reason it is also called a gravedigger of Adobe´s Flash plugin. To understand why that matters, just read over Steve Job´s famous Thoughts on Flash declaration where he explains why Apple decided against flash for iOS devices.

But it can do more than just graphics. WebGL basically allows to implement complex programs directly into websites. If you want to see some examples of how WebGL gets used already, just visit WebGL Samples – they have tons of them.

Or you just visit Google Maps in Full 3D mode using WebGL which might be one of the most used and most stunning implementations of WebGL on websites.

WebGL in Google Maps 3D_winbuzzer

 

 

Asm.js – Taking websites to the next level

While WebGL is nice this is not the end of progress. Edge also supports asm.js. Asm.js a subset of Javascript which allows for incredible performance gains. Programming code in C can be automatically compiled to ASM.js and then run at about half the speed than the native code, like in a real app/program.

To say it in other words: Complex programs like 3D videogames can be compiled to Javascript code and then run directly in your browser. And that´s exactly what will be needed for complex and visually rich websites running on WebGL.

Below is just one example of a 3D shooter using WebGL with asm.js in fullscreen mode. On GitHub you find more impressive asm.js examples.

TIP: If you want to run Edge with asm.js – you need to turn it on manually. The version of Edge coming with Windows 10 has it turned off as Microsoft is still working on a stable implementation.

Turning_on_9553570634_winbuzzer-150

–> Making Microsoft Edge even faster: How to enable asm.js javascript support

 

 

BananaBread: A 3D first person shooter game compiled to JS+WebGL

Unity WebGL Benchmark results: Edge vs. Chrome 44 vs. Firefox 39

We ran the Unity WebGL Benchmark on Edge, Firefox 39 and Chrome 44. To illustrate the impact of asm.js, we tested Edge using Unity WebGL Benchmark also without asm.js. As you can see below, the results are stunning.

Unity WebGL benchmark single test _winbuzzer

Based on the Unity WebGL Benchmark, Microsoft Edge currently provides the best asm.js performance and is even faster than Firefox which supports asm.js  for quite a while. But as you can see, there are different rankings in some sub-tests. As we found out with the Massive ASM.JS only benchmark, Edge still has some way to go before it can beat Mozilla Firefox.

Massive ASM.JS benchmark 150

–>ASM.JS ONLY! Benchmarking ASM.JS JavaScript performance of Microsoft Edge vs. Google Chrome 44 vs. Firefox 39

 

 

The overall score is a result of weighting, based on what the developers of Unity WebGL Benchmark consider more important. So, depending on the website code, in some scenarios Microsoft Edge will be slower than Firefox. But nearly always Edge should perform much better than Google Chrome.

[table id=3 /]

 

Specs of the testing machine

  • ASRock H97M Pro4 Intel H97
  • Intel Core i7 4770K 4x 3.50GHz
  • 8GB (2x 4096MB) Corsair Vengeance Black DDR3-1600 DIMM CL8-8-8-24
  • SSD 128GB Samsung 840 Pro Series 2.5″
  • Windows 10 Technical Preview build 9929
  • Intel HD Graphics 4600