Slide 1

Slide 2

2 ASP.NET Performance Chris Hay Director, Roskakori Limited

Slide 3

3 About Me Roskakori Limited Coordinator for Cambridge Region of NxtGenUg .NET User Group in Cambridge www.nxtgenug.net www.nxtgenug.net Blog aggregated on http://silverlight.net/communityhttp://silverlight.net/community Blog: http://silverlightuk.blogspot.com Email: chrishayuk (at) googlemail.com

Slide 4

4 Agenda Fiddler and Firebug Reduce Page Requests Reduce Page Size AJAX Bring Pages Closer to Users Make backend more efficient

Slide 5

5 Tools Firebug, Fiddle, Page Detailer Fiddler IE & Firefox, Difficult to monitor local requests Firebug Firefox Only, Monitors local requests IBM Page Detailer Good for graphs Used to monitor Requests, Request Sizes, Request Data

Slide 6

6 Fiddler, Firebug, Page Detailer Chris Hay Director Roskakori Limited

Slide 7

7 Reduce Requests The Big Culprit HTTP requests are the biggest web performance killer Reduce Requests, massively improve performance

Slide 8

8 Reduce Requests Single JS and Single CSS Files Combine all Javascript into one file Combine all CSS into one file

Slide 9

9 Combine JS and CSS files Chris Hay Director Roskakori Limited

Slide 10

10 Reduce Requests Image Maps Reduce Image Requests Use Image Maps Use Large Background Image

Slide 11

11 Multiple Images Vs ImageMaps Chris Hay Director Roskakori Limited

Slide 12

12 Reduce Requests IIS Caching Stores Assets in Browser Cache .css,.js, images, static html Saves Browser making future requests Upgrades: Use Versioning Policy MyJs001.js

Slide 13

13 Reduce Requests IIS Caching IIS 6.0 Web Site / Application / File -> Right Click Properties

Slide 14

14 Reduce Requests IIS Caching IIS 7.0 Enable staticContent Override in applicationHost.config Modify web.config

Slide 15

15 IIS Caching Chris Hay Director Roskakori Limited

Slide 16

16 Reduce Requests Home Page Performance Home page is most important page Needs to be as fast as possible Use Inline Scripts and CSS Only on home page Can load future assets post UI UI Displays First Assets (CSS, JS) loaded post page display in background Cached for future page requests

Slide 17

17 Home Page Performance Chris Hay Director Roskakori Limited

Slide 18

18 Reduce Requests Avoid Redirects Avoid Response.Redirect Invokes an extra client side HTTP Request Use Server.Transfer instead

Slide 19

19 Avoid Redirects Chris Hay Director Roskakori Limited

Slide 20

20 Reduce Page Size The second biggest culprit The smaller the page, the quicker the download Especially important in these areas Mobile Applications (Windows Mobile, IPhone, 3G Data Card) Non Broadband Users Many offices have less capacity than broadband Developing Countries

Slide 21

21 Reduce Page Size External Javascript + CSS Avoid inline styles (except home page) Avoid inline scripts (except home page) External scripts mean smaller page sizes Especially shared styles + scripts Especially pages accessed multiple times Not necessarily more performant on the home page

Slide 22

22 Reduce Page Size Use Silverlight in your Web Page Single File Download (.xap file) Resides in Browser Cache Available to all pages in website Reduces Page Size for Common Items Top Banner Menu Navigation Bottom Banner

Slide 23

23 Reduce Page Size - Silverlight Chris Hay Director Roskakori Limited

Slide 24

24 Reduce Page Size HTTP Compression IIS Most Browsers support HTTP Compression GZIP & Deflate IE, Firefox etc Drastically reduces page size Steps Browser Passes Accept-Encoding in Request Header Data is compressed and sent to browser Browser decompresses html Only GET is compressed, POST IS NOT Compressed

Slide 25

25 Reduce Page Size HTTP Compression IIS 6.0 IIS -> Enable Compression Click Properties on Website, Select Services Tab Enable Compress Static & Application Files Checkboxes IIS -> Web Service Extensions Add new Web Service Extension called HTTP Compression Set to \system32\inetsrv\gzip.dll Check extension status to allowed Edit Metabase.Xml For Deflate & Gzip, Set HcDynamicCompressionLevel=9

Slide 26

26 Reduce Page Size HTTP Compression IIS 7.0 Control Panel -> Turn On Windows Features Ensure Static & Dynamic Compression are checked

Slide 27

27 Reduce Page Size HTTP Compression IIS 7.0 applicationhost.config C:\Windows\System32\inetsrv\config\applicationhost.config Ensure doDynamicCompression=true Unless you are using page output caching Ensure doStaticCompression=true

Slide 28

28 HTTP Compression Chris Hay Director Roskakori Limited

Slide 29

29 Reduce Page Size Reducing Viewstate Enable Viewstate only on those pages that need it Compress Viewstate Offload ViewState to the session

Slide 30

30 Reduce Page Size Compress ViewState Uses GZIP to compress viewstate Page Load: No advantage over HTTP Compression Good for PostBack HTTP Compression only works on GET Override Page State Methods on Page LoadPageStateFromPersistenceMedium SavePageStateToPersistenceMedium

Slide 31

31 Reduce Page Size Offload ViewState to session Uses GZIP to compress viewstate Store ViewState in the session Override Page State Methods on Page LoadPageStateFromPersistenceMedium SavePageStateToPersistenceMedium

Slide 32

32 Reducing Viewstate Chris Hay Director Roskakori Limited

Slide 33

33 AJAX Update Panel Update Panel Calling Web Services Script Combining

Slide 34

34 AJAX Update Panel Only refreshes the html within the update panel Reduces Html Downloaded from postback

Slide 35

35 AJAX Update Panel Pitfalls Increases number of http requests Longer load time (harms performance) IIS Caching removes issue for subsequent requests Script Combining helps reduces requests Posts Back full page Including Viewstate Push Viewstate to session can relieve issue Compressing Viewstate can relieve issue Processes Full ASP.NET Page

Slide 36

36 AJAX Update Panels Chris Hay Director Roskakori Limited

Slide 37

37 AJAX Web Services Flow Expose Web Service to AJAX Call Web Service from Javascript Update DOM directly Increases number of http requests Only Posts Data that relates to the Operation No ViewState being posted Only performs service operation

Slide 38

38 AJAX Web Services Exposing a Web Service Create an ASMX Web Service (or WCF) Mark ASMX Service as ScriptService

Slide 39

39 AJAX Web Services Referencing the Web Service Reference in the ScriptManager Generates Javascript Proxy Code Inline Proxy Script Support Useful for Home Page

Slide 40

40 AJAX Web Services Calling the Web Service Proxy is fully qualified namespace for method

Slide 41

41 AJAX Web Services Chris Hay Director Roskakori Limited

Slide 42

42 AJAX Script Combining Combines Microsoft AJAX Scripts & Javascript files ScriptResource.axd MyJavascript.js Especially useful when using Ajax Control Toolkit Does not combine WebResource.axds Does not combine third party ScriptResources Can use a third party script combiner http://www.codeproject.com/KB/aspnet/fastload.aspx http://www.codeproject.com/KB/aspnet/fastload.aspx

Slide 43

43 AJAX Finding Scripts to Combine Any.js script file Look at name in loaded script (scriptresource.axd) Use the ScriptReferenceProfiler Returns a list of referenced scripts on the page http://go.microsoft.com/?LinkID=8843390

Slide 44

44 AJAX Script Combining

Slide 45

45 AJAX Script Combining Chris Hay Director Roskakori Limited

Slide 46

46 AJAX Script Manager Load Scripts Before UI LoadScriptsBeforeUI = false Default is true Page is rendered before loading scripts Faster for users Pitfall: User interacts with script before loaded Be careful before messing with

Slide 47

47 AJAX Silverlight Web Services to replace AJAX Detect if user has Silverlight User has Silverlight: download.XAP file User does not have Silverlight: use AJAX Use Html Bridge Advantages Managed Code faster than Javascript Avoids extra HTTP Requests to download AJAX Scripts Pitfalls Extra Code to Maintain

Slide 48

48 Silverlight Web Services Chris Hay Director Roskakori Limited

Slide 49

49 Bring Data Closer Content Delivery Networks Use a content delivery network to deliver static content Images Media Saves Bandwidth Closer Pages mean less latency Silverlight Streaming Free 10Gb Account Host Silverlight Applications Host Silverlight Video

Slide 50

50 Back End Performance Data Caching Database is generally biggest bottleneck backend Reduce calls to Database via Caching Cache Providers ASP.NET Cache Velocity Memcached

Slide 51

51 Data Caching Chris Hay Director Roskakori Limited

Slide 52

52 Back End Performance Page Output Caching Saves the Page / Control in the cache Can use substitution control to vary data

Slide 53

53 Page Output Caching Chris Hay Director Roskakori Limited

Slide 54

54 Back End Performance Long Running Requests Queue Request for Processing Asynchronous WCF Request Asynchronous Workflow Request MSMQ AJAX Progress Email Result

Slide 55

55 Back End Performance Switch off Debug Release Build Web.Config

Slide 56

56

Slide 57

57 Resources www.microsoft.com/teched TechTalksTechEd Bloggers Live SimulcastsVirtual Labs http://microsoft.com/expression http://msdn.microsoft.com Developers Kit, Licenses, and MORE!

Slide 58

58 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.