Our Blog

where we write about the things we love

11

Jun

Native or web? Microsoft blurs the lines – in a good way

Since the beginning of the mobile era, there has been a war between developing on platforms natively, or taking advantage of web support on mobile platforms for easy cross platform development.

Each approach has upsides and downsides. Reusing existing assets will shorten your time to market dramatically. If your site was built mobile first, it won't take any extra effort to gain a foothold in a new platform. Plus, considering most mobile platforms do web apps well, you can write once and deploy to all. However, considering JavaScript is usually not a first class citizen, web apps are seen as slow and laggy.

Building a 'native' application addresses that issue – and allows you to create an app that adheres to the design paradigms of that particular platform. The obvious downside is that native applications are expensive to build, and you need specialist developers for each platform.

Here are a few scenarios that commonly pop up, requiring developers to choose of web technologies:

  1. The client has an existing website that needs to be ported to a new platform, possibly with requirements for extending the website with notifications and location awareness.
  2. The app will be across all platforms and requires a consistent look and feel.
  3. The client has existing resources (components or workflows from previous projects) or is already employing web developers).

The problem with using existing cross platform solutions like Cordova (PhoneGap) to target new platforms is that it requires taking on an extra layer of dependency.

On top of that, updating the app means compiling for each platform on your dev machine, then pushing an update out to each store individually. This is cumbersome and time consuming. It also interrupts a web developer's normal workflow, and continuous integration via Git is not possible. 

Hosted Web Apps on Universal Windows Platform

Microsoft made headway into dissolving the lines between native and web by eliminating the Windows Runtime APIs in Windows 8. This makes it possible to create native apps in JavaScript, which calls into native APIs while delivering performance on a par with languages like C#.

At //Build2015, Microsoft announced the next evolution of web applications in Windows: Hosted Web Apps.

This new type of app will have code that lives in your website, and when packaged up, will be executed in a normal Windows container. This means it will have platform API access, allowing it to access the device's hardware, phonebook, Cortana, etc.

Because the code resides in your existing website, the developer can use their favorite web tools, their own source control system, and their own deployment process.

What’s more, wrapping up your existing website in a hosted web apps is extremely simple:

1. Create a website that has calls into WinRT APIs (LiveTiles, Cortana, Notifications, Location etc).

2. Include the URL to where your site is hosted in the app manifest, allow it in the content URI rule, and allow it to call WindowsRuntime APIs (see code below).

Hosted Web Apps on Universal Windows Platform

3. Package up the application and submit to store. Done!

The idea is that the code you write will be able to target the full Windows runtime API, which won't be active when the site is accessed via web browsers, but will be when the app is launched and the hosted site loaded. The code will know it's in a special container and act accordingly. At the moment, most WinRT APIs are available under beta, but it will enjoy full support when it launches officially.

When it’s time to update your app, since it's just a website you get to push the updates to the app as you would have normally – that is, through build tools like grunt, or via source control like Git deploy. Clients will get the update when they open up the app.

This means that you don't have to go though the store submission process unless you need additional permissions from users.

To make sure every one of your updates follow store guidelines, the Windows store will have a constant review process done by humans. They will also monitor whether your app is fringing upon another site (you can't just wrap up Facebook and call it your own).

This dramatically simplifies the process of porting your existing application to go across the entire Windows family (Desktop / Tablet / XBox / Phone). 

Many manifests 

As it turns out, hosted web apps is not a new concept. It's supported natively on:

All of these approaches depend on having a manifest, which declares the resources/icons that your app requires. Most are based on an open W3C standard.

Of course we want an easy way to deploy to all these platforms – that's the reason we went with web technologies, right? So Microsoft has developed manifoldJS, an npm module designed to create multiplatform hosted web apps. At the moment, it only supports app generation via the W3C manifest, but it will support both Chrome and FireFox manifests in the future.

ManifoldJS will create these projects using native hosted abilities if the platform supports them, and 'polyfill' using Cordova if the platform doesn't do hosted apps. A full list of supported platform is here.

Finally, since the tool is still very much in beta, Microsoft has called upon the legions of developers to help make it better on GitHub.

A Window of opportunity

Hosted Web Apps will make it super easy for developers to port their existing web apps to the Windows platform, without having to give up control of what tools they use. This will further blur the lines between web and native, allowing us to build great experiences without compromises.

It's also very exciting to see Microsoft embrace emerging open web standards to make life easy for developers. Can't wait for more!

Posted by: Jonny Lin, Developer, Seattle | 11 June 2015

Tags: Microsoft BUILD conference, Development, Web Apps


Blog archive

Stay up to date with all insights from the Intergen blog