Advertisement

You're blocking ads, which pay for BlenderNation. Read about other ways to support us.

Some Website Optimizations

37

Firebug network monitoringOver the last few weeks I've been quietly making a few technical changes to the site. For those of you who are interested in such things, I did a short writeup of my actions. If you couldn't care less about web technology, I'm still interested in hearing if you think the site's speed has improved!

  • As a first step, I used the excellent Firebug extension for Firefox to determine the loading time of the individual elements on our pages using Firebug's Net module. Firebug does many other useful things - if you're a web developer you should take a look at it!
  • Added mod_expires to the webserver. I asked our ISP to install the mod_expires Apache module on our webserver. Mod_expires sets the Expires HTTP header in server responses for specific filetypes which allows your browser to do better client-side caching. Initial visits will not be faster, but subsequent pageviews should be noticably quicker.
  • Turned on gzip encoding in WordPress. This was not trivial as the standard WordPress gzip option was interfering with our caching plugin. I found a fix for this though and ran a few tests: the filesize of our HTML code is reduced by around 84%: from around 56KB for the homepage to 9KB. Especially users on slow connections should notice this! (Of course, if your webserver has mod_gzip you can also use that instead of this technique).
  • Moved some JavaScript files around. I only recently learned something about JavaScript file includes: they will always be loaded sequentially, on all browsers. 'Normal' browser behaviour (for images and other page elements) is to load the files in parallel from the webserver. Firebug confirmed this and it was clear that the large number of Javascript files on our pages was causign them to slow down a lot. Moving some Javascript includes to the end of the HTML file doesn't speed up the actual loading time, but the page will appear fully rendered sooner even though the browser is still loading some more files.
  • Removed the Lightbox plugin.The Lightbox plugin was responsible for the fancypants image-enlarge effect. It looked great, but I was starting to really dislike how you had to close an enlarged image. Oh, and of course dropping it shaved off a few milliseconds of loading time as well ;-).

I'll keep looking for ways to improve BlenderNation's speed (within our current hosting package). If you have any suggestions I'd be happy to hear them!

Of course, the big question is: did you notice any improvements lately? How's the site speed for you now? Fast enough? Still too slow?

About the Author

Avatar image for Bart Veldhuizen
Bart Veldhuizen

I have a LONG history with Blender - I wrote some of the earliest Blender tutorials, worked for Not a Number and helped run the crowdfunding campaign that open sourced Blender (the first one on the internet!). I founded BlenderNation in 2006 and have been editing it every single day since then ;-) I also run the Blender Artists forum and I'm Head of Community at Sketchfab.

37 Comments

  1. I agree with the Lightbox effect. It did look cool, but I was constantly backing out of the site whenever I opened that and inadvertently pressed the back button. The speed of the site has always been fine for me.

  2. I can see quite an improvement in speed. It took only a fraction of the time that it usually did to load the page. Good Job!

  3. Nice work! I noticed the removal of Lightbox (though I didn't know that was its name), and was very happy about it. Clicking images and then going back with the browsers buttons (or gestures, etc) is much easier and faster. Animated effects can be nice, but in this case it was nothing but unnecessary wait time until you can see the images.

    Not even mentioning that it doesn't work well on slow computers, rendering unusable...

  4. If the site gets a lot more popular, you might want to step away from wordpress completely. Even with optimizations, it's known for not scaling well under heavy load.

  5. I used to think it was time for BN to upgrade its hosting package, as the load time seemed sluggish at times; but the changes made show significant speed improvements... good job! Thanks for pointing out the Firebug plugin too (good to know). On another note, does anyone know when the Mancandy DVD will be released? I thought I saw Bassam working on it at the Peach site a few weeks back. Thanks!

  6. @chris: really? I thought WordPress was a rather well-written system.. I'll keep it in mind though, although our current (shared) server can easily handle ten times the traffic that we're currently having.

    @Jacob: I think that Bassam will be giving a presentation on his upcoming DVD on the BConf-New York this weekend. Maybe he'll release some new info there.

  7. Hi,
    the speed is great.

    I liked the Lightbox, but from now on I have to live without it.

    Some of the pictures are overlapping the text, for example the one in this article. Using IE 7 (I know, my fault).

    Kind regards
    Holger

  8. oh, so, that's the reason.
    I wondered, why the pics don't enlarge on the same page, any more, but replace the current window or if you use MMB, will open in a new tab...
    I actually liked that Lightbox thingy...
    what about a frame-enlargement to get the full res pic? - if you click on it, the frame gets bigger, as well as the pic it-self -> you don't need to close the pic. It simply enlarges without hiding anything (as the text next to it should also refine itself...)

  9. @Holger: ah, I didn't know that. I'll have to get myself an IE7 installation to work that out ;-)

    @kram1032: hmm, well, some of our images are quite large so this strategy would probably completely screw up the page layout..

  10. Bart,
    Thank you for sharing your experience with us, I recently enhanced my site and got to the same conclusion about lightbox. I removed k2 as well because it was getting in the way of upgrading wordpress and removed the tags, which didn't really said anything new to the visitor. As for the mod thing I wish I could've asked for that, but linux shared virtual hoo-ha in bigdaddy is not exactly what you call a "premium service" (well, unless you are godaddy's marketing, that is...).

    So, thank you for the info, great stuff,
    shul

  11. Still an error in IE7 in the javascripting though.

    Line 530
    Char 1
    HideUtils is undefined

    Sadly that's as much as IE7 is giving... no firebug type device in it. Some of the css could be improved for IE yes, but no overlapping on the images, just no padding around em.

    Nice job btw, it does seem slightly quicker ;)

  12. Bart, thank you for sharing this information. Thank you for cancel lightbox!
    I didn't like lightbox, because must waiting long for every image.

  13. hum.... yeah, probably.
    About the speed: My connection is quite good, so, I don't really notice any difference, besides that pic-popup...

    what about a plane direct pic popup, without the expanding part? :)

  14. I am another that didn't like the lightbox, it was just slowing things down. Pages do seem faster here using FireFox on an old Mac, so that's an improvement for me.

  15. the site was really fast before, but I did not notice even before I saw your news that the page loaded kind off quick. great work!

  16. wow, great improvement yes!, now that you say it, I note the speed when doing "F5" in the frontpage.. I used to see the header right but the blog page "all white" for a second, then the text was loaded, now i don't see even a blink when refreshing, quite cool!

    Thanks for sharing those optimizations tips, they are really useful!

  17. Thanks for removing Lightbox... I hated it, because it was on my computer and browser much slower than just loading the pic...
    cu

  18. WOW!! I'm on a very slow connection and Blendernation used to be one of the slowest site's that I viewed on a regular basis, but now it loads very quickly. Good job!

  19. Sovereignncc-e on

    Thanks for speeding up the site; it used to be pretty slow even on a very fast connection, but now it seems to be great!

  20. I would have to say that the website is quite faster. I used to have to wait a little for it to load, but now it just pops right up. So good going.

  21. yup. I too hated that Lightbox thing. It was cool at first but later I started disliking it when I used to click on pics by chance and had to wait on my slow internet for it open up.

  22. Yes it is much faster now. But am I the only one who like lightbox? On my own website, i've condensed LB1 into a 800bytes script. No animation, and it loads almost instantly.

  23. @ mike
    your lightbox implementation really works better.
    I use Opera, which is in general faster than other browsers (for me), but in this scenario it's not.
    So, almost all images on your site load quite instantly on my system, but some take up to 8-9 sec. ... for some reasons

Leave A Reply

To add a profile picture to your message, register your email address with Gravatar.com. To protect your email address, create an account on BlenderNation and log in when posting a message.

Advertisement

×