Project Spartan For Developers in Windows 10

Microsoft has made its goals clear and more focused about the web and has implemented a few cool features in Spartan. The salient features that have changed are based on many factors and three of them are described here.

1. More Interoprability

This clearly means that developers will have the same experience as they have with other browsers. This also means that the developers will need to write once and deploy the code everywhere.

2. New Features

The features are new experiences and specs that exist in other browsers and also some new experiences that has been brought forward with time.

3. Fewer boundaries Between Apps and Web

This means the minimal difference developers will experience while they are in an app and the brower in Windows.

Evolution of Web

All the way back in 1995, IE came up with the Trident rendering engine. It was a single engine for rendering the web page. Not too long after that, Microsoft introduced HTML4, CSS2 and ES3. Trident was then split into two engines that were Quirks and Strict. The Strict engine was responsible for loading HTML4 and the Quirks was kept there to ensure the older contents could run on the web.



For IE7 and IE8, new specs began emerging and that was when IE began supporting CSS2.1. And thas was split into IE7 Compatibility Mode and IE8 Standard Mode and also kept IE5 Quirks to maintain backward compatibility. It's probably easy for the people to guess that it was not easy for the JavaScript Engine to work with all these various rendering engines.

The trend continued and to make the work a bit simpler, other than the !DOCTYPE, developers provided the liberty to specify “x-ua-compatible” tags to determine which way they wanted the browser to render the page.



In IE9 and IE10 and finally IE11, IE had multiple rendering engines that help render the page depending on the type of !DOCTYPE you are using or the Metatags that you have added to the page or how the page itself is constructed. In this way, IE was able to render all the various pages as they were intended by the developer. This was a bit difficult for the browser because it had to make too many decisions in a short amount of time. In the meanwhile, Firefox and Chrome took a different route. Instead of having multiple rendering engines, they had one rendering engine that was always up-to-date. This is exactly what Microsoft is doing with Project Spartan.

Project Spartan

1. Has a single rendering engine that will always stay up-to-date.
   
2. So no longer switching modes depending on the page, Spartan will have just one mode that will have compatibility built into it.

Architecture of Spartan AKA Microsoft Edge



So, the rendering engine is a fresh new one named Microsoft Edge HTML that will have compatibility and interoperability built into it and will always stay up-to-date. Although Spartan will be the default browser that will be shipped by Microsoft in Windows 10, IE 11 will come as a default application that will help the developers that had their pages running in the other modes to run as smoothly as they always do.



Since Windows 10 will power many types of devices and Spartan will be shipped to all the devices by default, the developers and testers won't need to take the pain of testing on all the devices since its Spartan is being shipped with all of them.

Features Added to Spartan

Spartan includes the rich HTML 5 features that will help developers create new experiences on the web. There are about 200+ interoperability fixes that will make Spartan more standard-compliant and work with the web since it is out today. A few of them are being listed below.



Minimizing the difference between Web and WebApps



The journey begins with websites that are nothing but web pages that we are looking at using Project Spartan.

The Hosted Web Apps are a totally new addition to Windows with Windows 10. This is where the majority of the resources are hosted on a server. The app can be discoverable from the store and can run locally on the device.

The packaged apps have been there for some time now. There has been significant improvement in this type. Now they support use Cordova or a web view as well.

Let's go into details on Hosted Web Apps

In today's world the Hosted Web App architecture is something like this.



So, the developers start with a Web Site. The web site is wrapped inside a WebView and that is put inside a Native App Container. This is how, when the app is launched, the WebView points toward the Web Site and the content is loaded. Also, Native Code can be paired up and use a custom bridge and hence some of the APIs can be exposed or events to fire them inside a WebView. All of this is hosted as a Web App and distributed with one or the other store.

Now in case of Windows 10



The process here is much easier and simplified. The native app container will directly point to the Web Server and hold the Web Site. Additionally, developers won't need Custom Bridge to add native code to their application. With Hosted Web Apps in Windows APIs can be contained in the app container. This means the code running on your Web Server will be able to call the Windows APIs much like JavaScript store apps do today. This can also be paired with Native Code that can also be exposed to your web site. So, native C++ or C# can be exposed to the DOM as a JavaScript method. So that you JavaScript can call native and native can return content to the JavaScript. Also, since the Windows APIs are being accessed directly from the web site , stuff like notification and lock screen integrations will be easy enough to implement.

Let's build a small demo of a Hosted Web Application.



Creating a new JavaScript Universal Apps.



Two Changes

1. Changing the Start Page to target the website you want to target.
   
   
2. Adding a rule and stating that anything that is inside the link is a part of my app and anything that is not is web and needs to be handled by opening up in a new browser.

And I have the Geek Monkey Studio app running as a Hosted Web App. The Code can be downloaded at http://bit.ly/1FfDnZx.

There are a couple of more things to keep in mind when building the Web Apps.

The manifest of W3C needs to be followed when writing the Web App. The following is a clear picture of how it looks.



I hope this article was useful and I wish to come up with more detailed articles about using Windows APIs and Web App Dev in Windows 10. Until then, happy hacking!