Wikia

Community Central

Comments169

Update Your CSS and JavaScript To Speed Up Your Wiki

One of the great parts about Wikia is that communities have the freedom to add their own Javascript (JS) and CSS to add functionality or change the appearance of their wiki. Many wikis have created great scripts and even share them between wikis. This is great and is something we hope continues.

Birdman-reducto

Like Myron Reducto, our engineers have been working on an amazing shrink ray to compress your wiki's custom JavaScript and CSS. Our engineers are a little nicer than Myron (if you give them food)

The way we've been including JS and CSS files up to this point has a drawback though: each file that is included causes your web browser to make an extra request all the way to our servers and back. Doing all of this work can be fairly slow, so the Performance Team here at Wikia has created new code to help communities load their files faster. We've seen some wikis with as many as 31 custom javascript files alone (not counting CSS), so cutting this down to only a couple of requests can make things much faster!

So what have we done? The short summary is that we made a javascript function called "importArticles()" which is very similar to the "importScript()" function that many wikis have been using to load their javascript files. The benefit is that this new file will allow communities to batch a whole bunch of their javascript files into a single request. On top of that, the combined file will be "minified". This means that all of the comments and extra spaces that are used to make the JS and CSS readable when you are coding, will not be in the version that is served to a user's web-browser. Similarly, using "importArticles()" to import multiple CSS files will be much faster than the previous method of using "@import" statements in CSS. Smaller files are faster to download - thus speading up the time it takes to go back and forth to the server. All of this means faster loading for you and all the visitors to your wiki!

To learn more about how to use the new functionality, please refer to the Help page. A big thank you to our Performance Team for all of their hard work and please let me know any questions you may have in the comments below.


Want to receive updates on the latest Staff blog posts? Then click here to follow this blog.

Around Wikia's network

Random Wiki