requirejs optimizer vs asp.net style/script bundling vs gzip compression - asp.net

Using asp.net server side I can do style bundling for .css files and script bundling for .js files. Alle .css or .js files are packed into one file for each format and minified.
Now I am also using requirejs on client side and asked myself now should I still use the requirejs optimizer to compress the .css and .js files like my javascript libraries (Often these libraries are already compressed...). Ok there are still the requirejs modules which are my viewmodels etc... which can be compressed but often those files are 3-4 kb not really worth the effort I think.
I also asked myself is requirejs optimizer worth the time I have to invest when there is anyway gzip compression for files which gives normally the best results.
So do you think I should go for requirejs optimizer or is style/script bundling on asp.net and gzip compression on IIS server totally enough?

Optimization with RequireJS is similar to what asp.net bundling does. Bundling achieves a slightly different goal to gzipping.
The point of bundling, is to lower the amount of http requests you need to make. Making 1 request is better than 5.
That file requested can then be minified & gzipped to reduce the size of data transferred.
Similar reductions can be achieved by using well-known cdn's. The idea being, why download jquery from your server, again, when the user probably has jQuery from XYZ's cdn already in their cache?
Whether you choose to use ASP.Net's bundling or RequireJS, is really up to you. I prefer ASP.Net bundling as it requires no additional steps in my build & deploy processes.

Related

Does it really matter to keep a .css fallback for less.js for production?

I am getting into less.js, for development and production on client sites. It's amazing how it can extend CSS, and for me there isn't really that much difference in speed when using it.
I'm wondering if it's really that important to keep a .css fallback file for less.js? I'm sure if a user is browsing without JavaScript enabled, then they wouldn't really be able to browse much other sites anyways. What do you think? Does it really matter?
Some say it's not mean't for production, but is that true?
If your using less I suggest you precompile your less files into CSS files. Relying on less to parse your css files on the client side is introducing another point of failure.
On their website http://lesscss.org/ there are plenty of examples of how to do this.
If your using .NET you can use T4 Templates or you can use DotLess which uses an httphandler to compile the less file on the fly server side.

Is there an equivalent to the mod_pagespeed Apache module for IIS?

Is there an equivalent to mod_pagespeed Apache module but for IIS?
IISpeed is a full-featured pagespeed port to IIS. It requires a paid license for production servers to avoid showing a banner, but it is free to try out.
Full disclosure: I am one of the people working on the port. So I will not push this further than mentioning the port.
This isn't a direct mod_pagespeed replacement but does some work towards reducing the number of requests, minifying and bundling JS and CSS.
It even automatically provides lossless compression of PNG-images and creates sprites of your background images. See the RequestReduce library.
(not tried it myself)
There aren't any solutions that do exactly what mod_pagespeed does at this time. There are several individual packages you could use to match most of the functionality.
The product #alirobe mentioned (aptimize) does many of them.
YUI Compressor (.Net port) works on JavaScript and CSS minification
IIS (version 5.1 and newer; though much easier to configure in IIS7+) can be configured to do GZIP compression for static and dynamic files
You can set Expires headers in IIS for static files, and in back-end .Net code for dynamic pages
.Net 2.0 can do some script combining with explicit configuration via the <asp:ScriptManager> control
.Net 4.0 has even more script combining abilities and can do more with less configuration. (example discussion of some of the new features)
UPDATE: .Net 4.5 further extends script combining with minification.
Scott Hanselman wrote The Importance (and Ease) of Minifying your CSS and JavaScript and Optimizing PNGs for your Blog or Website that lists many other individual packages that can be combined.
No.
Not right now, at least.
Do keep in mind, however, that mod_pagespeed is an automation of the best practices of web caching and speeding and you can manually set those up. PageSpeed Extension and YSlow extension are both very helpful to understand what should be optimized.
I don't believe there's a free one, but there is : http://www.aptimize.com/
update: Of course, if you're using any other automated deployment tool, you could do quite a bit by integrating commandline tools into the build batch script. HTML5 Boilerplate is probably your best practice reference there. You can also use server-side tricks like HttpCombine.ashx.

asp.net publish with whitespace removed

Obviously having whitespace in css, aspx and html pages is a great advantage at design time. But is there a way to (a tool that will) clear all the whitespace from all the files and possibly merge javascript and css files in a more optimal way.
I am using asp.net themes so there are quite a lot of separate css files that would be improved through some form of automated combining. I have seen a few http modules but that isn't quite what I want I just want to run something over the published project beofre sending it to the server.
EDIT: Compression at least in IIS is unfortunately not an option, we are currently running it on the same IIS server as a third party web based student management system. It doesn't like compression and the IIS options don't seem to be per application pool. I did apply asp.net compression but the bulk of my extra data seems to be the app_themes which I know would compress well I just don't want to have to manually go through compressing all the css separately.
An empirical study on the effect of removing white space from a not-untypical website (Drupal) showed minimal effects. (site also contains some links to non .net html white space removal tools)
I have gotten magical improvements in page size by aggressively managing viewstate size and using Blowery's http compression module.
Another strategy is to do minifiation (merging many css files into one). Telerik has such a component RadStyleSheetManager, it works only with style sheets embedded into assemblies.
There is another way
http://omari-o.blogspot.com/2009/09/aspnet-white-space-cleaning-with-no.html
I think one of the reasons that this was never included in .NET was because they expected you to turn on server compression in these scenarios. IMO I don't agree with this -- I think it's a shame that at least aspnet_compiler.exe can't do this optimization. It would be such a great performance boost on uncompressed connections. Anyway, you can enable compression on IIS 6:
http://www.microsoft.com/technet/prodtechnol/WindowsServer2003/Library/IIS/d52ff289-94d3-4085-bc4e-24eb4f312e0e.mspx?mfr=true
And it's even easier and more flexible in IIS7 to do so. I hope someone has a better solution than I!
4 guys from Rolla just published an article on a http module that removes white space. You would need IIS 7 in integrated mode to make it work for css (or possibly IIS6 with wildcard mappings)
It looks more like a proof of concept, but the code is free.
i found this:
http://msdn.microsoft.com/en-us/library/aa719805(VS.71).aspx
greets!

ASP.NET compression

From an earlier post about trying to improve my sites performance I have been looking at HTTP compression. I have read about setting it up in IIS but it seems to be a global thing for all IIS application pools I may not be allowed to do this as there is another site running on it as well. I then saw some code to put in global.asax to achieve the same thing on a per website basis.
See Here http://www.stardeveloper.com/articles/display.html?article=2007110401&page=1]1
Is this as good as the setup in IIS? How dramatic is the effect? Any known issues?
If you move forward with this, I'd suggest implementing a HttpModule versus global.asax. The HttpModule allows you to disable compression with a config change versus rebuilding and allows you to monkey with your compression Assembly separate from your web app.
Rich Crane has a pretty nice 2.0 module here: http://www.codeplex.com/httpcompression/ if you want to get up and running fast.
The blowery project Steven Rogers mentioned is a HttpModule as well.
Otherwise, writing your own is pretty straightforward. A HttpModule gives you the same events as global.asax - BeginRequest, EndRequest, and finer grained events like PostReleaseRequestState and PreSendRequestHeaders which you may need to iron out all the wrinkles.
As far as IIS compression verus HttpModule, IIS is definitely easier since you don't have to fuss with yet another Assembly. I've used both methods with business apps and both perform about equally under load testing. If IIS is available, I'd say use it.
Between 60 and 80% compression for HTML, JS, CSS, and XML files is common with gzip. Keep in mind a lot of your payload may be images and multimedia objects which are much harder to compress.
http://blowery.org/httpcompress/
We've used this compression utility at my job for a while. Pretty good.
I think the Global.asax option will be a good if you are in a shared hosting environment for example, where you don't have access to IIS configuration.
IIS 6 provides basic compression support, but if you're already in IIS 7, it provides you great HTTP compression support, you can define which files get compressed based on their MIME type in your configuration files...
It achieves essentially the same thing as IIS compression - both end up sending the response with gzip compression. I've recently implemented this method, and it consistently reduces response size by 60% with no performance impact worth worrying about.
There are a few possible issues. Firstly, you need to be careful about output caching. You need to use a custom VaryBy to make sure that different versions are cached for requests with different Accept-Encoding headers. Otherwise, if the compressed version is cached then all users will receive it, whether or not their browser can accept it.
Secondly, GZipStream will sometimes truncate the last few characters from the response if you use Response.End or Response.Flush, because the stream isn't closed until too late. I'm not aware of any nice solution to this.
Finally, this will only compress your HTML. Any CSS or Javascript files will be served normally. You'd need to, for example, serve those files via a custom IHttpHandler to compress them.
There are issues with JavaScript and VBScript. The JavaScript problem has been confirmed in a comment by xxldaniel on a codinghorror article, and I had issues with VBScript (for M$ Office automation) using a JSON-like "Scripting.Dictionary" with "Microsoft.XMLHTTP" request.
You may try mod_gzip modules. It uses managed ZLib version and allows highly adjustable configuration. Syntax is compatible with the same named Apache module and even extended. So for example you could set different compression level for different mime types and so on.

Good tool to minimize HTML footprint?

Does anyone know a good tool that can be run on a page (for asp.net, for example) to help to minimize the footprint size of the page?
The page will have typical items: HTML, Javascript, etc.
I've heard of Javascript crunchers in the past, that will make the size of the code as compact as possible (and obfuscate it, I suppose).
The goal is to help optimize the page size (make it as small as possible for speed, without changing anything).
Is this possible?
You could configure your web server to compress the page on the fly (and possibly cache the compressed version) for any client that indicates it can take a gzip or zip (or other) encoding, which is pretty much all of them.
Well, its not a automatic cleaner-upper, but I like YSlow for optimizing pages. And the YUI Compressor can minify your javascript.
If you're really interested in javascript, the keyword is "minify".
Also, look at this question just posted: HTML and stuff
Hope that helps!
Yep, definitely. I am not an asp.net guy, but things you could look for (as others have said):
gzip compression for the page - a
server option
js: like you said, there are
minifying options for javascript,
which in turn can be gzipped as
well.
css: there are minifying options
just like javascript, and can also
be gzipped.
Our java apps use pack:tag. Maybe you could find a similar .net replacement.
Yslow, already mentioned, can show what improvements you can make.
Search for some ASP .NET Compression techniques, if you're on IIS6 I recommend you MbCompression, however if you're running IIS 7 it has great built-in HTTP compression support, you can define which files get compressed based on their MIME type in your configuration files.
I personally would not sacrifice readability and maintainability for size.
Dynamic web server compression saved me a TON (given text compresses so well), and further optimization would have gained me very little.
A bit of fundamentals:
IIS saves compressed response of JS/CSS/Html files on disk so, subsequent requests for JS/CSS is served from Disk(bypassing step of compression). While compressed response for ASPX/ASCX are not cached on disk, since response varies from request to request.
Therefore, Best practise is to keep Javascript/CSS in their own files and avoid putting inline CSS/Script in aspx/ascx.
Broadly there are two ways to reduce Page-Size/HTML
1) Compression by webserver/HTTPModule
[Enable IIS 6 HTTP Compression][1]
2) Obfuscation/compression by third party tool - JASOB is my favourite one.
It can also compress/obfuscate javascript/css code from your php/asp.net/perl/jsp/XSLT file. And If like vanila DOS then there's command line interface too.
I have used it in several ASP.NET projects, I just select my webproject directory and JASOB provides nice option to publish obfuscated version of webproject directory. This means it obfuscates javascript/css from all files lying under your webproject directory and yeah it traverses sub directories too. And All of this in one click.
Hope it helps,
Maulik Modi
http://www.jasob.com/Features.html
[1]: - http://msmvps.com/blogs/omar/archive/2006/08/10/iis-6-compression-quickest-and-effective-way-to-do-it-for-asp-net-compression.aspx

Resources