tag : performance

Lazy Loading JavaScript With RequireJS

As sites are filled with more and more JavaScript, images, and other external assets, web pages have become more and more bloated and performance has started to become an issue. We’ve started to reduce the number of requests by concatenating our JavaScript and CSS files and using image sprites. We’ve shrunk file sizes by minifying and obfuscating our code and optimizing our images. All these measures are good, but they may not be enough. If you have a large JavaScript application, you could have a ton of JavaScript being loaded in that single concatenated file, and a lot of the code may be going to waste because it isn’t used. Let’s try to “lazy load” some of that code using RequireJS.

Is Sending Messages Through WebSockets Slow on Chrome?

It wasn’t long ago that I ran into a strange issue with Chrome. My Jasmine tests were failing because the timeout on the asynchronous actions was too short for Chrome, even though they worked perfectly fine for Firefox. This led to me writing some tests to see if Chrome’s WebSocket implementation was slow which gave some pretty interesting results. I’ve also heard some interesting results from my readers, so I decided to investigate some more.

Are WebSockets Slow on Chrome?

In my last article where I talked about unit testing Socket.IO with Jasmine, there was a point where I mentioned that I needed to use timeouts that were a second and a half when doing the asynchronous connecting and disconnecting from the Socket.IO server. It was working just fine with 750 millisecond timeouts on Firefox, but when I tested it in Chrome, timeouts were being reached and the specs were failing. Let’s see if we can get to the bottom of this and figure out why Chrome failed so hard here.

Delay Initialization With jQuery Delegation

As the internet fills with more and more JavaScript code, we need to become more and more aware of the impact our code has on performance. One of the big pain points can come from all of your code being initialized and loaded during jQuery.ready() or (if you’re a good boy who puts all the code at the end of the document) right away. We can delay some initialization until later, right?