1 / 38

Internet Explorer 8: Pushing the Web Forward

Internet Explorer 8: Pushing the Web Forward. Travis Leithead. Program Manager, IE Team. Pushing The Web Forward. Interoperability Productivity New features. @. new. Interoperability. The web platform should "just work" Adherence to standards Interoperability versus compatibility.

jean
Download Presentation

Internet Explorer 8: Pushing the Web Forward

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Internet Explorer 8: Pushing the Web Forward Travis Leithead Program Manager, IE Team

  2. Pushing The Web Forward • Interoperability • Productivity • New features @ new

  3. Interoperability • The web platform should "just work" • Adherence to standards • Interoperability versus compatibility

  4. Balancing Interoperability vs. Compatibility • IE versioning gives you the option • Opt-in to compatibility • Update on your schedule <meta http-equiv="X-UA-Compatible" content="IE=7">

  5. Examples of Real-world Compatibility Problems Demo

  6. Website Compatibility Best Practices • Use the META tag or HTTP header • Don't use user-agent string detection • Don't block forward compatibility with conditional comments • <!--[if > IE7]-->

  7. CSS 2.1 Interoperability • New layout engine • Great typographic foundation for the future • Designed with CSS 2.1 (and CSS3) in mind • Resolving ambiguities through test cases • 3221 new test cases • IE 8 Beta 2: feature complete!

  8. CSS 2.1 Features • Legacy bugs fixed! • Generated content • More printing controls • Outlines • Additional whitespace property values • CSS 3 • Writing mode (fixed) • Block progression • Box sizing

  9. HTML/ Programming Model • HTML • OBJECT tag • Form controls • More… • Programming model • Attributes work consistently • getElementById, etc. • DOM prototypes • Getters and setters

  10. ARIA • Roles/states for HTML-based widgets • Consumed by assistive technology

  11. Productivity • Developer tools • Performance

  12. Existing Tools • Authoring environments (Expression Web) • Great for authoring • Bad at debugging browser-specific issues • Debugging environments(Visual Web Dev Express) • Great for debugging script • Lots of overhead for lightweight debugging

  13. Developer Tools in IE8 Demo

  14. Performance • Making the browser faster • New platform performance features

  15. Faster IE8 • Performance tuning • Javascript • Common DOM APIs • Layout engine • “It just feels faster”

  16. Key Platform Performance • HTTP connection limit raised to 6 • More parallel downloads • Garbage collection of circular memory leaks

  17. New Performance Features • DataURI • Avoid cost of extra network requests • Cost to base64 encoding • Selectors API • Find HTML elements at run-time using CSS syntax • Native implementation(document.querySelectorAll)

  18. New Features For Developers • Where are developers limited in AJAX space? • Web applications and browser navigation • Network connectivity and offline scenarios • Safe cross domain communication

  19. AJAX Navigation • Set window.location.hash, and IE does the rest… • onhashchanged event • Update address bar • Update back button • Allows copy & paste of "AJAX URLs"

  20. AJAX navigation Demo

  21. AJAX Navigation Best Practices • Use AJAX navigation for state transitions that feel like a navigation

  22. Client-side Storage • Web applications need to store data locally • Cookies, UserData control • HTML5 client-side storage • window.localStorage (permanent storage) • window.sessionStorage (per-session storage) • Key/value string pairs • 10MB per domain, 100MB total

  23. Connection Events • Online/ offline events • window.navigator.onLine state indicator • Now available on Windows XP • Not a perfect solution for detecting site connectivity

  24. Client storage/ connection events Demo

  25. Cross-domain Communication • Browsers block cross-domain to protect against malicious content • Workarounds can be dangerous and costly • Use "safe" cross-domain features in IE8 • Cross-domain requests (XDR) • Cross-document messaging (XDM) • JSON • toStaticHTML

  26. Cross-domain requests (XDR) • XDomainRequest object • Mutual consent via request/response headers • Annonymous • No cookies/ authentication • Compatible with W3C's Access Control draft spec in Beta 2

  27. Cross-document Messaging (XDM) • Many mashup scenarios benefit from a frame “sandbox” • Frames in different domains are not allowed access • Use cooperative message posting from HTML5 in IE8 • postMessage and “message” event

  28. HTML Sanitization • 3rd party string data exposes potential for script-injection attacks • toStaticHTML • Filters out executable script constructs • Based on Microsoft’s Anti-Cross Site Scripting Library

  29. JSON Serialization • JavaScript Object Notation (JSON) commonly used to pass data as a string • Sites often revive JSON strings into objects using “eval” • At risk of running executable code • Native JSON parser built-in to IE8 • JSON.parse (string-to-”safe object”) • JSON.stringify (object-to-string)

  30. HTML sanitization/ JSON Demo

  31. Closing • Interoperability • Make your sites ready • Productivity • Enjoy performance • Use the developer tools • New features • New features • AJAX navigation • Network connectivity and offline • Safe cross-domain scenarios • We want your feedback! microsoft.com/ie8 travil@microsoft.com

  32. Q&A

  33. Slide for Showing Software Code Use this layout to show software code The font is Consolas, a monospace font The slide doesn’t use bullets but levels can be indented using the “Increase List Level” icon on the Home menu To use straight quotes " instead of smart quotes ”, do this: Click on the Office Button in the upper left corner At the bottom of the menu, choose PowerPoint Options From the left pane, select Proofing Click on the AutoCorrect Options button Select the AutoFormat As You Type tab, and deselect “Straight quotes” with“smart quotes”. Then Click OK.

  34. Resources • www.microsoft.com/teched Tech·TalksTech·Ed Bloggers Live Simulcasts Virtual Labs • http://msdn.microsoft.com Developer’s Kit, Licenses, and MORE! • http://microsoft.com/expression • Professional Design tools for tomorrow

  35. Related Content Breakout Sessions (session codes and titles) Interactive Theater Sessions (session codes and titles) Hands-on Labs (session codes and titles) Hands-on Labs (session codes and titles)

  36. Track Resources Resource 1 Resource 2 Resource 3 Resource 4

  37. © 2008 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

More Related