Useful JavaScript snippets


I have picked a few useful features of JavaScript which you might find helpful and I will explain how to use them.

A faster web Delay JavaScript loading to last


The speed of a website is important to most users especially when they are looking for specific information. They won’t wait around long for your website to load for that information and will try find it somewhere else. One way to motivate the user to stay is to get some content showing that they can consume as soon as possible to give incentive that the rest will be arriving shortly. The common blockers that cause the long wait from a blank page to all of a sudden everything shows are CSS and JavaScript files.

@font-face throwing a 404 on woff file


I’ve noticed that in Google Chrome and FireFox console the font file resources .woff throws a 404 when using @font-face CSS feature.

You will need to add a configuration to allow IIS to serve the font. In your web.config you can add the follow lines in the system.webServer block:

            <mimemap fileextension=".woff" mimetype="application/x-font-woff">

By applying this mimeType: application/x-font-woff for .woff will should fix this issue in Chrome and Firefox. This is the mimeType they request and IIS can’t work out which file type is should serve until it registered in the web.config or IIS.

Mobile website or responsive design


How do you go about choosing whether to develop a mobile site or responsive website? I would say its depends on what you are trying to achieve and with all the hype over responsive design you might sway in favour of that. In this post I discuss some benefits and negatives about both options which hopefully will help you come to a better decision.

Integrate LESS with MVC bundling


Less is an excellent tool for any developer to help mange CSS code. SASS is also a great tool that does a similar job but this post is  focused on LESS and bundling it with your ASP.NET MVC web application.

MVC 4 bundling CSS and JS files


MVC 4 provides an excellent tool to help with optimising your web application called bundling. The idea of bundling is quite simple, you tend to have multiple CSS and JavaScript files which can be rolled up into one CSS and JS file. The contents of the files is also minified to reduce the individual file size. It might seem odd at first to bundle all your files into one but the idea is to reduce the number of http calls made, because a web browser can only handle two - four http requests at a time. If you have a lot of request to different files this can make your web app appear slow.