Extension:Livelets

The extension Livelets  delays the loading of slower portions of a page, while the rest of the page loads quickly and is displayed as soon as possible, using MediaWiki's AJAX.

AJAX is a term for using JavaScript to load parts of a page on demand. The wiki can have multiple livelets loading in sequence.

Having the large content in a livelet speeds up the site in two ways:
 * 1) The large content only starts loading after the main page is loaded and accessible.
 * 2) Because the large content is a separate request with its own static URL, it can be cached locally by the browser.

Some of our sites use a livelet in the sidebar to load our main tree which can be very large for some users and would cause the site to be sluggish if it had to load the whole tree for each new page request.

Installation
Create a Livelets folder in your extensions directory. Download the latest snapshot and extract it to your extensions directory. Then include it in your LocalSettings.php file as in the following example.

Most people prefer to have an animated animated loader image such as these "throbber" images from the Wikimedia commons. The livelet containers render with a div element inside them with an class value of livelet-loader so that you can add some CSS rules such as the following example which renders a small box containing a rotating daisy. You can add this CSS to your MediaWiki:Common.css article.

Usage
To create livelets, wrap any areas of the page in the #live parser-function.

In the following example, a transclusion of the page called Template:MyVerySlowTable has been turned into a livelet:

Current State
Currently each livelet loads once using Ajax after the page content has loaded and then acts as a normal, static Mediawiki page.

The default installation of Livelets uses Ajax technology, which is used by many extensions and by the MediaWiki code itself and is considered safe.

With Ajax, changes do not propagate automatically from the server to the client: in the case of a page with dynamic content, the client must poll the server at a regular interval to see if any changes have taken place.

Future Development - Live Updates Using SWF
Later we will be adding the ability to make these areas "live" whereby the content in them will stay up to date automatically without the whole page having to be reloaded.

It is intended in the future that an option be made available to enable live updates using SWF, and adobe flash format. As mentioned above, with the current Ajax, changes do not propagate automatically from the server to the client: in the case of a page with dynamic content, the client must poll the server at a regular interval to see if any changes have taken place. With SWF above flash polling is not required when there is dynamic content.

The advantage of using SWF technology is that it allows a fully asynchronous connection to be established between the server and the clients making the system fully event driven without any regular polling involved.

Livelets will not have this SWF feature enabled by default. A variable will need to be set in LocalSettings.

The SWF method raises some security concerns as outlined by the XSS alert template above. The SWF functionality is not complete enough for use yet, but will require the following additional files to be installed into the livelet extension directory:
 * livelets.pl
 * livelets.swf - compiled from livelets.as using the Flashlets extension

Todo

 * ajax polling of header for auto-updating
 * perl/swf for asynchronous update (no polling)

Bugs

 * If added to Mediawiki:Sitenotice, only displays a near mirror image of the page the viewer in on, not the text in Mediawiki:Sitenotice. (Screenshot)  All collapsible tables from the article are open in this sitenotice mirror image.
 * The Extension:Tabber, when using the tags does not work inside ,  coding such as this also does not work:
 * Extension:Cite reference tags only appear within the subpage, not in the parent page. (Screenshot)
 * Table of contents appear within this subpage, and are not included in the parent page. The one advantage to this is a wiki page can have multiple table of contents on one page. (Screenshot)  Adding  in the subpage disables the subpage table of contents.

Change log

 * Version 1.0.2: Total rewrite to make current as of MediaWiki version 1.16
 * Version 0.2.6: Missing pagename parameter in AJAX request
 * Version 0.2.5: Removed dependence on Mootools and no longer requires a separate javascript file