F12 updates in Windows 10 January Technical Preview detailed

Sean Cameron

Internet Explorer

Since the Microsoft press event held last week, we have learned a great deal about what Windows 10 will offer the end consumer, and something about Redmond’s vision for the future. Included in the barrage of news was the revelation that Internet Explorer is going to be, in a manner, replaced by the newer, shinier “Project Spartan“.

Aware that many consumers, particularly those in the enterprise community, rely on tools built for Internet Explorer, Microsoft has been quick to clarify that such users will see little change. What has been done however is a unification, something of a theme for Redmond these, of the design language between the two browsers. Enhancements which are being brought to the F12 experience will also be carried over to the new project, meaning that making a move to the newer software may potentially be a relatively painless experience.

Some of these new features have been released for the January Technical Preview, and they change the overall experience of developing in F12 considerably.

Zoom

The first of these new changes comes to the overall UI. Though the changes aren’t as extensive as those made in early December, they nonetheless bring extra utility to the platform. These earlier changes are now standard for the January Technical Preview, and in addition to this a zoom function has been added, allowing for more granular editing.

Pretty Printing

The next changes come to the debugger, with the ability to add XHR breakpoints, which can now be controlled from the ‘Breakpoints’ pane. CSS source maps support has also been added, so now LESS and SASS files can be directly navigated to, rather than the automatically generated CSS file. The ‘Pretty Printing’ tool also now supports HTML and CSS, and can be activated via the ‘Pretty Printing’ button.

Changes have also been made to the console, which now has a new ‘View in DOM explorer’ feature, allowing users to quickly move from a selected DOM element in the console tool to the node in the DOM explorer, making things a little easier. Network errors are now also displayed directly in the console.

Some improvements have also been made to the flow of the UI, allowing for a more seamless experience. The ‘Profiler’ tool is no longer a separate entity, instead it has been incorporated into the ‘UI Responsiveness’ tool, meaning users don’t have to shuffle from one tool to the next. The Profiler is now titled ‘JavaScript call stacks’ with the UI Responsiveness tool. The UI Responsiveness and Memory tools also make use of the DOM Explorer function, allowing it easier to investigate DOM elements.

Network

Lastly, the ‘Network’ tool has received a complete visual overhaul, reminiscent of that completed in December, bringing a much cleaner, sparser interface. This will no doubt improve the experience for all, complete newcomers and grizzled veterans alike.

Given that these features are part of the preview, there are two things to bear in mind. Firstly that a great many more features are yet to come, secondly that they might not function perfectly. Users are advised to report any problems to Microsoft.

Do you welcome these changes? Let us know in the comments below.