Fast ASP.NET Websites

Copyright

For online information and ordering of this and other Manning books, please visit www.manning.com. The publisher offers discounts on this book when ordered in quantity. For more information, please contact

     Special Sales Department

     Manning Publications Co.

     20 Baldwin Road

     PO Box 261

     Shelter Island, NY 11964

     Email: 

[email protected]

©2013 by Manning Publications Co. All rights reserved.

No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by means electronic, mechanical, photocopying, or otherwise, without prior written permission of the publisher.

Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in the book, and Manning Publications was aware of a trademark claim, the designations have been printed in initial caps or all caps.

Recognizing the importance of preserving what has been written, it is Manning’s policy to have the books we publish printed on acid-free paper, and we exert our best efforts to that end. Recognizing also our responsibility to conserve the resources of our planet, Manning books are printed on paper that is at least 15 percent recycled and processed without the use of elemental chlorine.

ISBN: 9781617291258

Printed in the United States of America

1 2 3 4 5 6 7 8 9 10 – MAL – 19 18 17 16 15 14 13

Dedication

For Emily — ngiyakuthanda

Brief Table of Contents

Copyright

Brief Table of Contents

Table of Contents

Preface

Acknowledgments

About this Book

1. Defining performance

Chapter 1. High-speed websites

Chapter 2. First steps toward a faster website

2. General performance best practices

Chapter 3. Compression

Chapter 4. Caching: The sell-by date

Chapter 5. Minifying and bundling static files

Chapter 6. HTML optimization tips

Chapter 7. Image optimization

Chapter 8. ETags

Chapter 9. Content Delivery Networks

3. ASP.NET–specific techniques

Chapter 10. Tweaking ASP.NET MVC performance

Chapter 11. Tweaking ASP.NET Web Forms performance

Chapter 12. Data caching

 Appendix

Index

List of Figures

List of Tables

List of Listings

Table of Contents

Copyright

Brief Table of Contents

Table of Contents

Preface

Acknowledgments

About this Book

1. Defining performance

Chapter 1. High-speed websites

1.1. Why optimize?

1.2. The financial impact

1.2.1. The business impact

1.2.2. The search engine ranking impact

1.2.3. The mobile user impact

1.2.4. The environmental impact

1.3. How to optimize

1.3.1. Profile

1.3.2. Identify

1.3.3. Implement

1.3.4. Monitor

1.4. Where to optimize

1.5. The Performance Golden Rule

1.6. Summary

Chapter 2. First steps toward a faster website

2.1. The basics of HTTP

2.1.1. Understanding an HTTP GET request

2.1.2. Understanding an HTTP GET response

2.1.3. Understanding HTTP status codes

2.2. Empty cache vs. primed cache

2.3. Tips and tools for interpreting performance charts

2.3.1. What does it all mean?

2.3.2. Google Chrome developer tools

2.3.3. Internet Explorer developer tools

2.3.4. Firebug

2.3.5. Safari Web Inspector

2.3.6. HTTPWatch

2.3.7. WebPagetest

2.3.8. Fiddler

2.4. Performance rules to live by

2.4.1. Yahoo! YSlow

2.4.2. Google PageSpeed

2.5. Summary

2. General performance best practices

Chapter 3. Compression

3.1. What is compression?

3.2. Why should I use compression?

3.3. Pros and cons of compression

3.4. Types of compression

3.4.1. Gzip

3.4.2. Deflate

3.4.3. SDCH

3.5. Accept-Encoding

3.6. The Surf Store application

3.7. Adding compression to your website

3.7.1. Using IIS to add compression to a website

3.7.2. Using a Web.config file to add compression to a website

3.7.3. Adding compression with other techniques

3.8. The results

3.9. Summary

Chapter 4. Caching: The sell-by date

4.1. What is HTTP caching?

4.2. IIS and HTTP caching

4.3. Web.config settings

4.4. Caching considerations

4.5. Output caching

4.5.1. Output caching in an ASP.NET MVC application

4.5.2. Output caching in an ASP.NET Web Forms application

4.6. The results of HTTP caching

4.7. Summary

Chapter 5. Minifying and bundling static files

5.1. What is minification?

5.2. What is bundling?

5.3. New bundling and minifying features in ASP.NET 4.5

5.4. Utilizing bundling in ASP.NET MVC

5.5. Utilizing bundling in ASP.NET Web Forms

5.6. The results

5.7. Summary

Chapter 6. HTML optimization tips

6.1. Where to position CSS and JavaScript in a web page to achieve the best performance

6.1.1. CSS

6.1.2. JavaScript

6.2. How the order of styles and scripts affects rendering

6.2.1. The impact of duplicate scripts

6.3. HTML5

6.4. A note on HTML5 browser support

6.4.1. HTML5 asynchronous JavaScript

6.4.2. HTML5 Web Workers

6.4.3. Browser support for HTML5 Web Workers

6.4.4. HTML5 Web Workers in an ASP.NET MVC application

6.4.5. Web Workers in an ASP.NET Web Forms application

6.5. HTML5 application cache

6.5.1. HTML5 application cache considerations

6.5.2. HTML5 application cache in an ASP.NET MVC application

6.5.3. HTML5 application cache in an ASP.NET Web Forms application

6.5.4. Application cache support

6.6. Summary

Chapter 7. Image optimization

7.1. What’s the big deal with image optimization?

7.2. Online image optimization tools

7.2.1. Smush.it

7.2.2. Kraken

7.3. Command line image optimization tools

7.3.1. Pngcrush

7.3.2. Jpegtran

7.4. Image Optimizer—a Visual Studio extension

7.5. Using data URIs

7.5.1. Implementing data URIs in an ASP.NET MVC application

7.5.2. Implementing data URIs in an ASP.NET Web Forms application

7.6. The importance of specifying image dimensions

7.7. The results

7.8. Summary

Chapter 8. ETags

8.1. What are ETags?

8.2. Why should I change ETags?

8.3. Removing ETags in ASP.NET Web Forms and ASP.NET MVC applications

8.4. The results

8.5. Summary

Chapter 9. Content Delivery Networks

9.1. What is a Content Delivery Network?

9.2. CDN options

9.3. Domain sharding

9.4. Developing with a CDN

9.4.1. ASP.NET MVC HTML helper for CDN development

9.4.2. ASP.NET Web Forms helper for CDN development

9.5. The results

9.6. Summary

3. ASP.NET–specific techniques

Chapter 10. Tweaking ASP.NET MVC performance

10.1. Using only the view engines that you need

10.2. Release mode vs. Debug mode

10.3. The importance of a favicon

10.4. Utilizing a code profiler

10.4.1. MiniProfiler for database profiling

10.5. Summary

Chapter 11. Tweaking ASP.NET Web Forms performance

11.1. HTML improvements

11.2. Web.config settings

11.2.1. Publishing your application in Release mode

11.2.2. Disable tracing if it’s not used

11.2.3. Disable session state

11.2.4. Disable ViewState when it’s not needed

11.3. Response.Redirect vs. Server.Transfer

11.4. Utilizing a code profiler

11.5. Fixing the issue

11.6. Summary

Chapter 12. Data caching

12.1. Server-side data caching

12.2. System.Runtime.Caching

12.3. What should I cache?

12.4. The sample application

12.5. Notes on distributed caching

12.6. Summary

12.7. Look at how far you’ve come!

 Appendix

A.1. Setting up your local machine as a web development server with IIS

A.2. Useful links referenced in this book

Profiling tools

Image optimization tools

Before and after results

Index

List of Figures

List of Tables

List of Listings

Preface

Ever since I began building websites, I’ve been interested in learning how to make them more efficient. It’s a great feeling when you transform a slow website into a finely tuned engine that makes people say Wow! In my pursuit to improve my websites’ performance, I’ve trawled the net and spent long hours trying to find the best techniques. Technology is constantly developing and improving, and developers are finding newer and ever more ingenious ways of speeding up their sites.

If you’re a developer who is new to coding and website performance, the plethora of resources can be quite overwhelming. Until I wrote Fast ASP.Net Websites, I hadn’t seen a book that teaches the ASP.NET developer the exact formula, in a step-by-step process, how to shave seconds off their page load times and drastically improve the performance of their websites.

I hope you agree this is that book.

Acknowledgments

Until now I never thought about all the research and background work that goes into writing a technical book. This book would definitely not have been possible without the help of many people.

Most importantly, I want to thank my partner Emily for her encouragement and for sticking with me through all the early mornings and weekends it took to finish this book. Every time my alarm went off, you never complained, not even once. Thank you for all your support!

Sincere thanks to Jennifer Stout at Manning Publications for being the best development editor...ever. Your cheerful attitude and brilliant work were instrumental in the evolution of this book. Thank you for always listening to my ideas and being so efficient. Thanks to Michael Stephens for believing in me and in the idea I had for this book. You guided me through each step of the process and this book wouldn’t have been possible without your advice! Thanks to Candace Gillhoolley for your help with the marketing of this book and to Rebecca Rinehart for working with me on my idea for the book cover. Many thanks also to everyone on the Manning production team for guiding me through the process and bringing the book to press.

Special thanks to Sam Saffron for helping me review the MiniProfiler content. Sam was one of the creators of MiniProfiler and helped me, even though he and his wife had a new baby on the way, and he was in the process of launching a new website!

I am also grateful to all the reviewers who helped shape and improve the manuscript during its development: Bryn Keller, Danylo Kizyma, Ivo Štimac, James Berkenbile, Jason Hales, Jeff Smith, Mark Sponsler, Michael Roberts, Onofrio Panzarino, and Wyatt Barnett.

Special thanks to Robin Osborne and Tim Clarke for their reviewing help, and to Adam West for his technical proofread of the final manuscript.

I would like to thank my family for their encouragement throughout the writing process. You have been fantastic!

Finally, thank you for purchasing this book. I hope you enjoy reading it as much as I enjoyed writing it. I hope you will learn valuable techniques you can use and apply to all your websites.

Let’s make the web faster!

About this Book

This book is designed to allow you, as a developer, to get the best performance out of your websites. This book delivers details, best practices, caveats, tips, and tricks to improve the performance of your websites and reduce the load times of your web pages.

How to use this book

Every new chapter in this book is intended to teach the reader a new web performance concept. As you follow along with each chapter, and open the accompanying source code, you will be able to follow the steps provided to improve the performance of the sample website. Each chapter in the book is also designed to work as a standalone concept; that is, you can chose a chapter and apply just that technique and you will improve your website. As we progress through the chapters, we will be constantly improving the sample website and each technique will take the sample website closer to performance nirvana.

Who should read this book

This book is for web developers who are looking to improve the performance of their web pages. It is also for developers who are looking to dive a little deeper into web development and understand the page lifecycle that is happening as a user loads their website. This book covers fundamental techniques that are applicable to web pages regardless of the programming language. The techniques that are covered are generally universal, but aimed toward the ASP.NET website developer.

Roadmap

Part 1 Defining performance teaches you the valuable skills you need to understand in order to begin improving the performance of your website. It explains the importance of focusing on the front-end code in order to achieve the biggest and most scalable gains.

Chapter 1 explains the value and benefits that optimizing your websites will bring. It also shows you the steps you’ll need to take in order to optimize your websites by using the Performance Cycle.

Chapter 2 focuses on the basics of HTTP so you understand the processes that take place under the hood. The chapter then shows you the essential tips and tools you’ll need in order to interpret performance charts when you’re profiling your website. You’ll then look at the different profiling tools that you’ll be using throughout this book.

Part 2 General performance best practices is where the real work begins. You’ll start to investigate and apply individual techniques to improve the performance of your web applications.

Chapter 3 covers compression and why you should use it. After going through the different types of compression, you’ll look at the Surf Store application used throughout this book. You’ll then apply compression to the sample application and compare the difference in page sizes.

Chapter 4 looks at HTTP caching and shows how you can use it to improve the performance of your web applications. The chapter also shows you how to apply output caching to your ASP.NET projects.

Chapter 5 explains the new bundling and minifying features built into ASP.NET 4.5. You’ll then run through examples and apply them to the Surf Store application.

Chapter 6 dives a little deeper into web performance and offers HTML optimization tips and techniques you can apply to your web pages. It also explains the performance benefits HTML5 can bring, as well as ways to integrate these HTML5 techniques into your web pages.

Chapter 7 discusses the importance of image optimization and how it can significantly reduce the weight of your web pages. This chapter looks at the different image optimization tools available and shows you how to use them. The chapter discusses the benefits data URIs can bring and walks you through an end-to-end example that demonstrates how you can apply data URIs to an ASP.NET application.

Chapter 8 discusses ETags and explains their usage on the web today. It explores whether you should or shouldn’t be using them in your web application and runs through an example that demonstrates how to remove ETags from your application.

Chapter 9 focuses on Content Delivery Networks (CDNs) and the benefits they can bring in terms of speed and performance. It teaches you how to build a simple HTML helper that you can use in your ASP.NET development when dealing with CDNs. This technique can help you save money and bandwidth expenses when dealing with CDNs in a development environment.

Part 3 ASP.NET-specific techniques starts to shift focus slightly and looks at ASP.NET optimization techniques that are based on server-side code.

Chapter 10 teaches you how to tweak your ASP.NET MVC applications to squeeze precious milliseconds out of your page load time. The chapter shows you how to apply a profiler called MiniProfiler to your MVC application and use it to pinpoint bottlenecks in your application.

Chapter 11 shows simple techniques you can use to improve the performance of your ASP.NET Web Forms applications, how to apply MiniProfiler to your ASP.NET Web Forms application, and how to identify any bottlenecks in your code.

Chapter 12, the final chapter, discusses the importance of server-side data caching. It teaches you how to apply the features built into the System.Runtime.Caching namespace and illustrates an end-to-end example, showing data caching in action. The chapter reviews the progress you’ve made and compares the Surf Store application before and after we made improvements. The speed differences between the applications are astonishing!

Code conventions and downloads

All source code in the book is in a fixed-width font, which sets if off from the surrounding text. In many listings, the code is annotated to point out the key concepts. We have tried to format the code so that it fits within the available space in the book by adding line breaks and using indentation carefully. Sometimes, however, very long lines include line-continuation markers. Code examples appear throughout this book. Long listings appear under clear listing headers; shorter listings appear between lines of text or in an illustration.

Throughout this book, I make use of C#, JavaScript, CSS, and HTML as much as possible. I am a fan of both ASP.NET Web Forms and ASP.NET MVC, and each chapter includes sample code for both frameworks. This allows you to choose either framework and still learn and apply the same techniques.

All of the sample code is available for download on the Github website at https://github.com/deanhume/FastASPNetWebsites as well as from the publisher’s website at www.manning.com/FastASP.NETWebsites. Each chapter has its own source code that you should be able to fire up and begin working on immediately. There is no setup involved.

Software requirements

In order to run the code samples that are provided in this book, you will need a copy of Visual Studio 2012. You can use either Visual Studio Express 2012, which is a free download on the Microsoft website, or the full version of Visual Studio 2012. The source code will only work with versions of Visual Studio 2012 and not previous versions as there are some newer features in Visual Studio 2012 that have been built to improve the performance of web pages.

You will also need a copy of either the Yahoo! YSlow tool or the Google PageSpeed tool to profile the sample web pages in this book. These two tools are both free and work with most modern browsers. You will need to check with the vendors to find out which browsers they are compatible with.

Author Online

The purchase of Fast ASP.NET Websites includes free access to a private web forum run by Manning Publications where you can make comments about the book, ask technical questions, and receive help from the author and other users. To access the forum and subscribe to it, visit www.manning.com/FastASP.NETWebsites. This page provides information on how to get on the forum once you are registered, what kind of help is available, and the rules of conduct on the forum.

Manning’s commitment to our readers is to provide