Windows 10: Creating your own browser with HTML and JavaScript

  1. Brink's Avatar
    Posts : 33,158
    64-bit Windows 10 Pro build 18262
       27 Aug 2015 #1

    Creating your own browser with HTML and JavaScript

    Over the past several months, we have made numerous improvements to the Microsoft Edge rendering engine (Microsoft EdgeHTML), focusing on interoperability with modern browsers and compliance with new and emerging standards. In addition to powering Microsoft Edge, EdgeHTML is also available for all Universal Windows Platform (UWP) apps via the WebView control. Today we would like to demonstrate how the WebView control can be used to create your own browser in Windows 10.

    Using predominantly JavaScript, HTML, and CSS, we created a JavaScript UWP app in Visual Studio 2015. With the former language, we took advantage of the new ECMAScript 2015 (ES2015) support in Chakra, the JavaScript engine behind Microsoft Edge and the WebView control.

    Our sample app includes many UI components you would see in today’s modern browsers. For instance, we include forward and back buttons, refresh and stop buttons, favorites and settings menus, a favicon and address bar, etc. We also include supplemental features, such as keyboard shortcuts, full screen mode, favorites management, and responsive design.

    The crux of the functionality stems around the powerful WebView control. Offering a comprehensive set of APIs, it overcomes several of the limitations which encumber iframes, such as framebusting sites and document loading events. Additionally, the x-ms-webview, how one declares a WebView in HTML, provides new functionality that is not possible with an iframe, such as better access to local content and the ability to take screenshots. When you use the WebView control, you get the same web platform that powers Microsoft Edge.

    Demo the app

    You can view the full set of code in our repo on GitHub. You can also demo the browser live by installing the app from the Windows Store, or by deploying the Visual Studio solution.

    What’s next

    This is merely a glimpse of what is possible with the web platform on Windows 10. With the WebView control, we were able to create a simple and intuitive browser using primarily JavaScript. Still, there are plenty of additional features we could build on top of this project, such as right-click, inking, theming, or even tabs. We can also refactor the core implementation to leverage transpilers and fill the ES2015 feature gaps. Our team really enjoyed building this proof-of-concept browser, and would love to continue working on it. Reach out to us on Twitter, submit issues, or if you have a killer feature you are interested in, send us a pull request. We would love to hear any feedback you have on the browser or the web platform in general!

    – Josh Rennert, Program Manager, Microsoft Edge

    Source: Creating your own browser with HTML and JavaScript | Microsoft Edge Dev Blog
      My ComputersSystem Spec

  2.    27 Aug 2015 #1

    Umm, so let me see I use GitHub the Open-source repository (used by mainly Linux and Android users) to download the full set of controls, to develop Microsoft's browser. Maybe I could get it to actually import bookmarks in the correct order, instead of backwards. Or get it so you could reset it to original default mode.

    Perhaps, these are Microsoft's baby steps, in going to all open source.
      My ComputerSystem Spec


Related Threads
Hello, I just got my free upgrade to Win 10 from Win 7 and I cannot access the personalization screen to change or access my my screen saver password. I get this all the time now: there was a problem starting javascript:" \..\ mshtml The...
Solved Edit html with Spartan in Browsers and Email
I just started using Spartan. I tried to edit one of my html files as I usually do by right clicking on a space then choose "View Source" which will open it up. But with Spartan if I right click I don't have the View Source option. Does anyone know...
How to Import and Export Bookmarks via HTML in Firefox This tutorial will show you how to easily export and import your bookmarks in the Mozilla Firefox web browser using HTML files. As well as acting as a backup of your bookmarks this is also...
Want to use an image as a link to an image but nothing shows. Paths are correct. There's not even that broken image icon to show that it can't find the images... it just shows nothing. And I know this works cos I did it before but somethings...
Our Sites
Site Links
About Us
Windows 10 Forums is an independent web site and has not been authorized, sponsored, or otherwise approved by Microsoft Corporation. "Windows 10" and related materials are trademarks of Microsoft Corp.

© Designer Media Ltd
All times are GMT -5. The time now is 18:46.
Find Us