Windows 10 now caches compiled byte code for all js files with a UTF8 BOM
With Windows 10, Microsoft has introduced a number of new technologies to make deploying web apps to the Windows Store easier. They now support the W3C Web Application Manifest to allow you to create hosted web apps from your website through their Project Westminster and even provide Manifold JS to help create these standard-based mainfests as well as creating packages for Windows, Chrome OS, Firefox OS and using Cordova to create packages for iOS and Android. Pretty powerful stuff!
This allows you to have an app in stores for people that like apps and a website for those people that prefer those, both running from the same code base; and increase your general visibility and availability.
While hosted web apps have many advantages over fully packaged applications; most notably the ability to update and fix them without going through the full store approval and certification process; which isn’t instant or particularly rapid in any of the stores; there are also advantages to packaged apps on Windows 10; or a hybrid app with some local and some from the web, either in an
iframe or a
HTML+JS apps have had their application load times accelerated since Windows 8 with bytecode caching. This has improved for Windows 10 as now all js files will have their compiled byte code cached rather than just the ones referenced from the main html page:
In fact the Windows App Certification Kit won’t pass your HTML+JS app unless you do save as utf-8 and include a byte order mark for encoding.
Checks the app deployment to verify that all .js files have been converted to bytecode.
If this test fails, consider the following when addressing the issue:
- Verify that event logging is enabled.
- Confirm that all previous versions of the app are uninstalled.
- Exclude identified files from the app package.
This is on top of the data being local and not needing any network round trips so it becomes super fast. We still use the ASP.NET website to do most of the work; but have very fast start up and local images, scripts etc for some of it, which gets downloaded as part of the app install – giving the best of both worlds.
There seem to be a lot of npm, Gulp plugins and Grunt plugins to remove utf-8 byte order marks; but not many to actually add them – so we use the following code in our Gulpfile to do what a plugin would do:
Then you can call it just as you would a regular plugin:
Now all the js files will have a BOM and you should pass the Certification test and get the speed up advantage of byte code caching.
As an aside why would you want to use a
x-ms-webview over an
iframe? There are a number of reasons including allowing the iframe
access to platform items: Windows Runtime objects, responding to permission requests
like fullscreen etc.
For me the biggest one is it runs in its own thread separate from the UI thread of its parent container:
I just use a simple replace for
iframe in my html Gulp task to handle that; though there are some slight differences
in comms between the
x-ms-webview but the path is easily chosen with some feature or path detection.