Extension:Livelets

MediaWiki extensions manual - list

Livelets Release status: stable
Implementation	Parser function, Ajax
Description	Delay loading of slower portions of a page while the rest of the page loads quickly.
Author(s)	User:Nad, User:Jacknz
Last version	1.1.0 (2012-01-19)
MediaWiki	1.6+
Database changes	no
License	GPL
Download	SVN [?]: checkout-url tree code changes
Example	dead island wiki - Large template
Hooks used ArticleAfterFetchContent
Check usage and version matrix

The Livelets extension 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:

include( "$IP/extensions/Livelets/Livelets.php" );

Animated loader image

"Throb"

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.

/***** Animated loading image for Extension:Livelets *****/
.livelet-loading {
 border: 1px solid #ccc;
 width: 150px;
 height: 100px;
 background: url( http://upload.wikimedia.org/wikipedia/commons/d/de/Ajax-loader.gif ) no-repeat center center;
}

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:

{{#live: {{MyVerySlowTable}} }}

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

• Sortable tables do not appear inside the livelet subpages.
• If livelets coding is added to Mediawiki:Sitenotice, {{#live: }} 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 livelt subpage, and in the parent page. (Screenshot)
• Table of contents appear within this livelet 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 __TOC__ in the subpage disables the subpage table of contents.
• [Edit] sections inside the livelet do not work, click these edit links result in an error message similar to this one:

Cannot find section

From Generic Wiki

You tried to edit a section that does not exist. It may have been moved or deleted while you were viewing the page.

Return to Weapons.

Adding the magic word __NOEDITSECTION__ inside the livelet will result in all of these edit section links, [edit] being removed inside the livelet, but will not effect the [edit] links outside of the livelet section.

• 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