WinJS 3.0 - release for all platforms

Original author: Rachel Nizhnikova
  • Transfer

The project team "Windows Library for JavaScript" (WinJS) is in a hurry to announce the first release since the submission of an open project at the conference // BUILD 2014 - WinJS 3.0 library . WinJS 3.0 release offers developers:

  • Cross-browser / cross-platform support covering the most common desktop and mobile browsers, as well as HTML-based application environments such as Apache Cordova

  • A modular approach that gives developers control over optimizing performance and loading only those WinJS library modules that are necessary for their website or application

  • Improved design of universal controls , providing more comfortable work for end users and covering phones, tablets, computers - form factors with different screen sizes and input devices

The release includes a number of improvements based on feedback and pull requests from members of the GitHub community. We would like to express special thanks to all those who have already contributed to the project in this way.

You can start using WinJS.3.0 today , using your favorite package manager (Bower, npm, or NuGet), using a CDN link, downloading a zip archive from our website, or copying a repository to build your own copy from GitHub.

Cross-platform features and design improvements

Over the past five months, the WinJS team has focused on making the library run seamlessly across multiple platforms and browsers. This means that now you can use WinJS not only for your universal Windows applications, but also for your web sites and for creating mobile applications based on HTML using various platforms using technologies similar to Apache Cordova. See the full table of browsers and operating systems supported by the WinJS library.

The main thing we focus on in release 3.0 is the improvement of the cross-platform infrastructure for composing the interface, working with the keyboard, localizing strings and supporting languages ​​that are written from right to left, as well as an exhaustive set of unit testsworking on our components for major operating systems and browsers; on a design update for standard WinJS controls and embedded HTML controls, providing a unified user interface on many platforms and browsers.

Design updates

Adding to the WinJS repository a font containing the characters used in AppBar, NavBar, FlipView, Ratings, Hub, and SearchBox; so now they are displayed on many operating systems and browsers. For example, here's what the Ratings control looks like:

ListView now supports Grid and List templates on all platforms. The dependency of the template on CSS Grid has been removed, so ListView with a grouping of elements is now supported.

AppBar now has a visual representation for hiding and calling the panel, so the panel no longer depends only on gestures from the edges. FlipView

navigation buttons are always displayed on platforms that do not support scroll anchor points in CSS.

Controls input range ( the Input range ), a built-in control HTML - slider , and other built-in controls received update the look on different platforms.

After the CSS Grid dependency has been removed, the NavBar control has updated its interface composition.

Search suggestions in the Searchbox control began to appear on various platforms (after the layer was created to support the API suggestions).

The Toggle switch control is no longer dependent on the embedded HTML slider and is fully functional and visually appealing on all platforms.

Now the controlPivot has buttons on either side of the title bar, so you can use it with the mouse. It is also beautifully displayed on screens of all sizes (previously it was displayed only on small screens of mobile phones).


Now WinJS 3.0 is divided into several dozen modules. You can continue to use the library with all modules, as in the past, or you can make a custom build of WinJS only with those modules that you need. This gives you the ability to control the optimization of your productivity and the size of the loaded resources.

This is especially useful when using WinJS for a website or when using it with other popular libraries like AngularJS or Knockout. WinJS was designed from the ground up to have good internal architecture and compatibility with other libraries. Now it’s easy to make WinJS assemblies that include only the layers you use.

For example, if you want to use only the AppBar in your application, you can make a custom WinJS assembly that will contain suitable modules for the Appbar, excluding the rest of the WinJS library, and then use it together with a library like Knockout, including data binding.

For instructions on building a custom WinJS library, see the wiki page on GitHub .

We made our own assembly in order to improve the performance of . The table below shows the data about some custom assemblies that you can make, as well as the corresponding sizes of JavaScript code

Improved design for universal controls

In addition to cross-platform changes, we began the process of combining our library. Thus, phones, tablets and computers will be supported by a single WinJS release.

To achieve this, animations that were previously only available for the phone are now available for all form factors in WinJS 3.0. The Pivot control, previously only available on the phone, is now also supported on all form factors. It has been improved in such a way that it can be controlled with the mouse and keyboard, as well as scaled to all screen sizes.

Stay tuned to keep abreast of further improvements in this direction!

Moving forward

The WinJS MS Open Tech project team members would like to sincerely thank you for the warm welcome we received from the GitHub community, as well as for your interest and support.

Together, we can continue to build WinJS as a large, open-source JavaScript library that adapts to the needs of web developers around the world and helps us all create a delightful user experience library that can share code between sites and applications. We urge you to send pull requests and file problems via GitHub or via the “ask a question” links on our website.

Check our facebook page and follow us on Twitter@buildwinjs , there we post large announcements about our project.


WinJS on GitHub .
The main WinJS library controls are here .
Test the main controls at .
You can read about using FlipView in universal applications here .
MVA mobile development course for web developers.
Download Microsoft Visual Studio here .

Also popular now: