CS193H: High Performance Web Sites Lecture 1: Introduction Steve Souders Google

Slides:



Advertisements
Similar presentations
High Performance Web Sites 14 rules for faster pages
Advertisements

Optimizing Websites with YSlow Tom Lianza Co-Founder Wishlisting.com Tom Lianza Co-Founder Wishlisting.com.
CS193H: High Performance Web Sites Lecture 9: Rule 5 – Put Stylesheets at the Top Steve Souders Google
CS193H: High Performance Web Sites Lecture 7: Add an Expires Header Steve Souders Google
Steve Souders Even Faster Themes Disclaimer: This content does not necessarily reflect.
High Performance Web Sites Essential Knowledge for Frontend Engineers
Episodes a shared approach for timing web pages Steve Souders Google Disclaimer: This content does not necessarily reflect.
Steve Souders Even Faster Web Sites best practices for faster pages Disclaimer: This.
Steve Souders Even Faster Web Sites (inside ma.tt) best practices for faster pages.
CS193H: High Performance Web Sites Lecture 16: Rule 13 – Configure ETags Steve Souders Google
CS193H: High Performance Web Sites Lecture 4: Class Projects Steve Souders Google
CS193H: High Performance Web Sites Lecture 13: Rule 10 – Minify JavaScript Steve Souders Google
CS193H: High Performance Web Sites Lecture 22: Vol 2 – Optimize Images, Use Iframes Sparingly, Flush the Document Early Steve Souders Google
Steve Souders Life's too short, write fast code part 1 Disclaimer: This content does.
Steve Souders Even Faster Web Sites best practices for faster pages Disclaimer:
CS193H: High Performance Web Sites Lecture 17: Rule 14 – Make Ajax Cacheable Steve Souders Google
CS193H: High Performance Web Sites Lecture 8: Rule 4 – Gzip Components
High Performance Widgets Steve Souders Chief Performance Yahoo!
CS193H: High Performance Web Sites Lecture 21: Vol 2 – Split Dominant Domains Steve Souders Google
High Performance Web Sites Essential Knowledge for Frontend Engineers
CS193H: High Performance Web Sites Lecture 15: Rule 12 – Remove Duplicate Scripts Steve Souders Google
Exceptional Performance Evolution at Yahoo! Steve Souders Chief Performance Yahoo!
CS193H: High Performance Web Sites Lecture 3: HTTP and the Web 100 Performance Profile Steve Souders Google
CS193H: High Performance Web Sites Lecture 6: Use a CDN Steve Souders Google
Steve Souders Even Faster Web Sites best practices for faster pages Disclaimer: This content does not necessarily.
Steve Souders Life's too short, write fast code part 1 Disclaimer: This content does.
CS193H: High Performance Web Sites Lecture 20: Vol 2 – Don't Scatter Inline Scripts Steve Souders Google
Steve Souders Even Faster Web Sites best practices for faster pages Disclaimer: This content does not necessarily.
CS193H: High Performance Web Sites Lecture 5: Make Fewer HTTP Requests Steve Souders Google
CS193H: High Performance Web Sites Lecture 12: Rule 8 – Make JavaScript and CSS External Steve Souders Google
CS193H: High Performance Web Sites Lecture 19: Vol 2 – Load Scripts Without Blocking Steve Souders Google
CS193H: High Performance Web Sites Lecture 10: Rule 6 – Put Scripts at the Bottom Steve Souders Google
CS193H: High Performance Web Sites Lecture 2: The Importance of Frontend Performance Steve Souders Google
CS193H: High Performance Web Sites Lecture 11: Rule 7 – Avoid CSS Expressions Rule 9 – Reduce DNS Lookups Steve Souders Google
CS193H: High Performance Web Sites Lecture 18: Vol 2 – Split the Initial Payload Steve Souders Google
Web Performance Meetup 1 Web Performance 101 Jeremy
Web Performance Meetup 1 Web Performance Toolbelt Jeremy
The World Wide Web and the Internet MIS XLM.B Jack G. Zheng June 20 th 2005.
The World Wide Web and the Internet MIS XLM.B Jack G. Zheng May 13 th 2008.
Introduction to HTML, XHTML, and CSS
Stevesouders.com/docs/velocity-wpo pptx Disclaimer: This content does not necessarily reflect the opinions of my employer.
How are we CREATING Your Web and Global Presence.
Web Site Performance What makes web sites slow? Back end Front end Tools for measuring performance Firebug / YSlow Visual Studio Test Edition W3.org html.
Copyright © Steven W. Johnson
Fawaz Ghali AJAX: Web Programming's Toy.
Dave Chaffey, E-Business and E-Commerce Management, 4 th Edition, © Marketing Insights Limited 2009 Slide 1.1 Introduction to e-business and e-commerce.
COMPUTER B Y : L K. WINDOWS INFORMATION B Y : L K.
Lecture 12: Web Services MicrosoftIntroducing CS using.NETJ# in Visual Studio.NET Objectives “Web Services are objects callable across a network.
CHAPTER 15 WEBPAGE OPTIMIZATION. LEARNING OBJECTIVES How to test your web-page performance How browser and server interactions impact performance What.
Improving Web Site Performance and Scalability While Saving Money Robert Boedigheimer ∙ Web Application
High Performance Websites (Based on Steve Souder’s lecture) By Bhoomi Patel.
&.zip Disclaimer: This content does not necessarily reflect the opinions of my employer.
Mark Phillip markphillip.com 200s, 304s, Expires Headers, HTTP Compression, And You.
Performance, SEO, Accessibility Ivan Zhekov Telerik Corporation
Web Performance Optimization Boban Stojanovski (Senior Front End Developer at Solaborate) Think Fast by default.
Page Speed Bryan McQuade Richard Rabbat. Outline  What is Page Speed?  Inception of Page Speed  Cool features  Identify unused JavaScript and CSS.
Session I Chapter 1 - Introduction to Web Development
Web Design (1) Terminology. Coding ‘languages’ (1) HTML - Hypertext Markup Language - describes the content of a web page CSS - Cascading Style Sheets.
Software Consultancy Services. Contents  Introduction  Vision  Mission  Expertise  Technology  Application Design  Services on offer  Showcase.
Session 1 Chapter 1 - Introduction to Web Development ITI 133: HTML5 Desktop and Mobile Level I
Restricted © Siemens AG All rights reserved A Developer’s Insights Into Performance Optimizations for Mobile Web Apps CT DC AA EM LP2 | June 2015.
What is Seo? SEO stands for “search engine optimization.” It is the process of getting traffic from the “free,” “organic,” “editorial” or “natural” search.
Site Speed: The Ultimate UX Feature… for SEO. A case study on how to increase search engine crawling and online conversion Jonathon Colman In-House SEO.
Enhance Your Page Load Speed And Improve Traffic.
Time is the enemy: Ten Core Lessons for Achieving Peak
Hints and tips for faster web apps
Web Systems & Technologies
HTML5 Level I Session I Chapter 1 - Introduction to Web Development
Chengyu Sun California State University, Los Angeles
High Performance Mobile
Presentation transcript:

CS193H: High Performance Web Sites Lecture 1: Introduction Steve Souders Google

Speed Matters users notice pride in our work engineering best practices Google: +500 ms -20% traffic * Amazon: +100 ms -1% sales * *

the road here – University of Virginia, BS System Eng – SAIC – Advanced Decision Systems – Stanford University, MS EES – Helix Systems (co-founder) – General Magic – Dialog – WhoWhere?, Lycos – CoolSync (co-founder) – Yahoo! 2008 – Google

14 Rules 1.Make fewer HTTP requests 2.Use a CDN 3.Add an Expires header 4.Gzip components 5.Put stylesheets at the top 6.Put scripts at the bottom 7.Avoid CSS expressions 8.Make JS and CSS external 9.Reduce DNS lookups 10.Minify JS 11.Avoid redirects 12.Remove duplicate scripts 13.Configure ETags 14.Make AJAX cacheable

High Performance Web Sites YSlow

June 22-24, 2009

Evangelism Conferences Web 2.0 Expo The Ajax Experience OSCON Google/IO SXSW Companies Yahoo! Amazon Zillow Microsoft Google Conferences WordCamp Future of Web Apps Widget Summit Velocity Rich Web Experience Companies Apple Netflix Twitter LinkedIn

that leads us to CS193H What this class is not: a programming class a backend performance class (C++, Java, MySQL, etc.) about search engine optimization (SEO) about business performance What this class is: optimizing performance where it has the biggest impact: from the web server to the browser hands-on work with HTML, JavaScript, CSS, & HTTP applied research about the Web (including Web 2.0) a narrative about optimizing web pages at the end of which you'll understand how the Internet works

CS193H Logistics Most information is on the class web site: Souders (\'sau-ders\) like "sour" or "ouch" Blog: Guest lecturers next week (I'm out)

Class Requirements Firefox Edit HTML, JavaScript, CSS Web hosting(?) Web server configuration

Homework Go to hpws and "Apply for group membership" hpws Read HPWS, Chapter A: The Importance of Frontend Performance Bring your laptop