Looking for something?

SP 2010: Developing for performance part 7 - Crunching those scripts

Author: Tobias Zimmergren
http://www.zimmergren.net | http://www.tozit.com | [@zimmergren](http://www.twitter.com/zimmergren)

Introduction

SharePoint 2010 developing for performance article series: In this series of articles I will briefly introduce you to some key concepts when it comes to developing for performance in our SharePoint 2010 applications.

Related articles in this article series

Part 1 – SP 2010: Developing for performance Part 1 – Developer Dashboard Part 2 – SP 2010: Developing for performance Part 2 – SPMonitoredScope Part 3 – SP 2010: Developing for performance Part 3 – Caching in SharePoint 2010 Part 4 – SP 2010: Developing for performance Part 4 – Logging Part 5 – SP 2010: Developing for performance Part 5 – Disposal patterns and tools Part 6 – SP 2010: Developing for performance Part 6 – CSS Sprites Part 7 – SP 2010: Developing for performance Part 7 – Crunching those scripts Part 8 – SP 2010: Developing for performance Part 8 – Control that ViewState

*Part 7 (this article): *This article is a bit shorter than the others and will only cover the concept of crunching your script files in your projects. The reasoning behind a crunched file is to save on transfer-bytes between the client and server.

JavaScript crunching

The technique called script crunching (or JavaScript crunching) is often referred to a way of eliminating useless characters from the script files to allow them to load faster. This means that by eliminating unnecessary whitespaces, line breaks and putting semicolons in the right places you can achieve a file size that is smaller than the original.

The reasoning behind crunching the script files are much that you can save on the client/server transfer and therefore also minimize the HTTP requests – which in turn is one step in the right direction for minimizing the page load time and render time.

Short in short; Do consider the technique if you’ve got large scripts that are taking a bit too long to load.

SharePoint 2010 are using crunched scripts

In SharePoint 2010 we already have a few examples of where JavaScript crunching is working in action. One example is the SP.js file which is essentially a crunched JavaScript library in SharePoint 2010. You do however also have the ability to use the SP.debug.js which contains the same content, but without being crunched.

When you look at those two files in an editor, you’ll quickly see the difference between them:

SP.js – 381 KB – Crunched JavaScript file in SharePoint 2010 image

SP.debug.js – 561 KB – The same file, but without the crunch image

You can see that the mail difference between these two files is the file size. This means that if you’ve using the crunched version of the JavaScript file, your application will load slightly faster.

How to: Crunch your script files

There’s tons of tools on the market for crunching your scripts. Here’s a few online tools for crunching those scripts:

(or just search for JavaScript crunch, and you’ll find all the tools you’ll ever need)

What is the difference when using crunched scripts?

As a quick summary I did a test with an application that are loading a somewhat large script file – first without any crunching and then the same application loading the files after they’ve been minimized with a crunch. These are the results in my SharePoint 2010 application.

******************Without crunching**

****************

******************After crunching**

****************
JavaScript file size: 445871 bytes
(435 KB)
JavaScript file size: 331798 bytes
(324 KB)
  Saves around 25.5% in file size

image

Summary

A brief summary of the result is that if you’re crunching your script files, you’ll get a slightly smaller footprint when loading the page and making the HTTP requests. The reason for bringing this to your attention is of course that it’s a technique that’s been around for quite some time, but people tend to miss out on it because they’ve not seen the results of it. So, here you go – a visual chart telling you how it differs to use the exact same script, with and without crunching.

Enjoy.

0 Comments 09 May 2011
Tobias Zimmergren

Tobias Zimmergren

Hi, I'm Tobias. I am a Microsoft MVP for SharePoint and I use this site to share my thoughts on tech with you on topics like SharePoint, Office 365, Azure and general web development.

  Malmö, Sweden

Related Post

Comments powered by Disqus
res.