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.

A video of this extension working

Installation
Create a Livelets folder in your extensions folder. Download the latest snapshot and extract it to your extensions folder. Then add the following to your LocalSettings.php file at the bottom:

Animated loader image
Most people prefer to have an animated loading image (a small box with a rotating daisy) when the sub-page is loading.

These "throbber" images can be found at Wikimedia commons and added to your wiki's MediaWiki:Common.css page.

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
The default installation of Livelets uses safe Ajax technology, which is used by MediaWiki coding and many extensions.

Each subpage loads once after the main page content has loaded. These subpages then acts as a normal, static, non-changing Mediawiki page. So a page with dynamic content, the viewer must reload the page at a regular interval to see if any changes have taken place.

Future Development - Live Updates Using SWF
The possibility exists to make these subpages "live", in which the subpage content will stay up to date automatically without the whole page having to be reloaded. See this page for more details. This can be done using SWF, an adobe flash format. As mentioned above, with the current Ajax, changes do not update automatically, but in the case of a page with dynamic content, the site must poll the server at a regular interval to see if any changes have taken place. With SWF flash, polling is not required when there is dynamic content.

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.
 * Extension:Cite reference tags only appear within the subpage, and 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.
 * If the title of the main page with the livelets has "&" in the title the livelets will not display at all, and there will be a "The requested page title was invalid, empty, or an incorrectly linked inter-language or inter-wiki title. It may contain one or more characters which cannot be used in titles." error. (Screenshot)

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