igh Performance Responsive Design (2014).pdf

(14635 KB) Pobierz
High
Performance
Responsive
Design
BUILDING FASTER SITES ACROSS DEVICES
Tom Barker
High Performance Responsive Design
Yes, you
can
use responsive web design to create high
performance, compelling websites. With this practical
book, author Tom Barker demonstrates that responsive
design is not just a frontend-only approach, but also
a philosophy for taking advantage of the entire web
stack. Responsive design patterns and anti-patterns,
derived from heavily used real-world sites, are guiding
principles throughout the book.
Ideal for frontend-focused web developers, this book
shows you how to incorporate responsiveness and
performance into your project plan, use Node.js for
device-specific functionality on the backend, and
write automated tests for a continuous integration
environment. You’ll explore many useful tools and
responsive frameworks, and gain useful insights from
Barker’s own experience with responsive design along
the way.
Get a primer on web performance concepts,
web runtime performance, and performance
tracking tools
Write functionality with Node.js that serves
up a device-specific experience to the client
Explore client-side solutions, such as lazy
loading entire sections of a page—including
images, styling, and content
Validate service level agreements (SLAs) by
writing automated tests with PhantomJS
Examine several responsive frameworks,
including the author’s server-side framework,
Ripple
Tom Barker,
a software engi-
neer, engineering manager, and
solutions architect, is Director
of Software Engineering and
Development at Comcast, and an
adjunct professor at Philadelphia
University.
DESIGN/ WEB DESIGN
Twitter: @oreillymedia
facebook.com/oreilly
CAN $36.99
US $34.99
ISBN: 978-1-491-94998-6
High Performance
Responsive Design
Building Faster Sites Across Devices
Tom Barker
Beijing 
·
 Cambridge 
·
 Farnham 
·
 Köln 
·
 Sebastopol 
·
 Tokyo
High Performance Responsive Design
by Tom Barker
Copyright © 2015 Tom Barker. All rights reserved.
Printed in the United States of America.
Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472.
O’Reilly books may be purchased for educational, business, or sales promotional use. Online
editions are also available for most titles (http://safaribooksonline.com). For more information,
contact our corporate/institutional sales department: (800) 998-9938 or
corporate@oreilly.com.
Editors:
Mary Treseler and Nick Lombardi
Production Editor:
Melanie Yarbrough
Copyeditor:
Octal Publishing Services
Proofreader:
Jasmine Kwityn
Indexer:
Deadline Driven Publishing
Cover Designer:
Eleanor Volkhausen
Interior Designers:
Ron Bilodeau and
Monica Kamsvaag
Illustrators:
Rebecca Demarest
Compositor:
Melanie Yarbrough
November 2014: First Edition.
Revision History for the First Edition:
2014-11-04
First release
See
http://oreilly.com/catalog/errata.csp?isbn=0636920033103
for release details.
The O’Reilly logo is a registered trademark of O’Reilly Media, Inc.
High Performance
Responsive Design
and related trade dress are trademarks of O’Reilly Media, Inc.
Many of the designations used by manufacturers and sellers to distinguish their products are
claimed as trademarks. Where those designations appear in this book, and O’Reilly Media, Inc.,
was aware of a trademark claim, the designations have been printed in caps or initial caps.
Although the publisher and author have used reasonable care in preparing this book, the
information it contains is distributed “as is” and without warranties of any kind. This book
is not intended as legal or financial advice, and not all of the recommendations may be
suitable for your situation. Professional legal and financial advisors should be consulted,
as needed. Neither the publisher nor the author shall be liable for any costs, expenses, or
damages resulting from use of or reliance on the information contained in this book.
978-1-491-94998-6
[TI]
[
contents
]
Preface
Chapter 1
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
v
State of the Industry of Responsive Design
. . . . . . . . . . . . .
1
The Problem with Responsive Design
. . . . . . . . . . . . . . . . . .
1
Summary
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
20
Chapter 2
Primer on Performance of Web Applications
. . . . . . . . . .
21
The Basics of Measuring Performance
. . . . . . . . . . . . . . . .
21
Tools to Track Web Performance
. . . . . . . . . . . . . . . . . . . . . .
30
Web Runtime Performance
. . . . . . . . . . . . . . . . . . . . . . . . . . . .
40
Summary
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
48
Chapter 3
Start with a Plan
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
49
A Journey Down the Slippery Slope
. . . . . . . . . . . . . . . . . . .
49
Project Plans
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
50
Summary
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
61
Chapter 4
The Backend
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
63
The Web Stack
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
63
Web Application Stack
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
69
Responding on the Server Side
. . . . . . . . . . . . . . . . . . . . . . . .
70
Implications of Cache
Edge Side Includes
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
83
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
84
Summary
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
86
Chapter 5
The Frontend
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
87
Working with Images
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
87
Lazy Loading
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
95
Summary
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
105
iii
Zgłoś jeśli naruszono regulamin