jQuery Plugin for Faster Page Load Time - Pronto

Pronto is a jQuery plugin that reduces the over all server load and font-end render time of your page by using a "partial page load" technique. The plugin only loads a piece of the page at a time instead of the entire document.

How to use it:

1. Add jQuery library and jquery.bp.pronto.min.js to your current web page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/jquery.bp.pronto.min.js"></script>

2. The html

<div id="pronto">
<h2>Page Title</h2>
<p>YOUR CONTENT.</p>
</div>

3. The javascript

$(document).ready(function() {
// Init pronto
$.pronto();

// Bind pronto events
$(window).on("pronto.render", initPage)
 .on("pronto.load", destroyPage);

// Remember to init first page
initPage();
});

function initPage() {
// bind events and initialize plugins
}

function destroyPage() {
// unbind events and remove plugins
}

4. Options.

var options = {
// Cache AJAX responses
cache: true,

// Forces new requests when navigating back/forward
force: false,

// Jump page to top on render
jump: true,

// Flag for content loaded into modal
modal: false,

// Selecter to target in the DOM
selector: "a",

// Custom render function
render: $.noop,

// GET variable for requests
requestKey: "pronto",

// Key / value pair for rendering responses (key is response key, value is target selector)
target: {
  title: "title",
  content: "#pronto"
},

tracking: {
  legacy: false, // Use legacy ga code
  manager: false, // Use tag manager events
  variable: 'currentURL', // data layer variable name - macro in tag manager
  event: 'PageView' // event name - rule in tag manager
},

// Transition timing callback; should return user defined $.Deferred object, which must eventually resolve
transitionOut: $.noop
};

Change Log:

v3.2.1 (2014-10-06)

• Adding transitionOut option to define custom timing transition
• Demo update

v3.1.4 (2014-10-04)

• Fixing issue with natural navigation and modal option

v3.1.3 (2014-09-23)

• Fixing issue with scrolltop on navigation

v3.1.1 (2014-09-23)

• Adding parameter to request event for pop state;

v3.1.0 (2014-09-21)

• Switching to LESS; Minified css; New build process; Updating demo; Fixing issue with hash links

v3.0.18 (2014-08-20)

• Adding 'modal' option for laoding content into modal overlay

v3.0.17 (2014-08-08)

• Fixing requestDelay on popState

v3.0.15 (2014-08-05)

• Adding enable and siable methods

v3.0.14 (2014-03-13)

• Adding 'jump' option; Fixing docs;

v3.0.13 (2014-03-13)

• Adding progress event based on XMLHttpRequest2 api;

v3.0.10 (2014-03-13)

• Fixing bug with loading errors (404, etc);

v3.0.9 (2014-02-07)

• Fixing issue with event propagation.

v3.0.8 (2014-01-23)

• Fixing issue with event propagation.

v3.0.3 (2014-01-13)

• Fixing even namespace - example: load.pronto is now to pronto.load (caused weird issues with window loading *facepalm*);

v3.0.2 (2014-01-07)

• Fixing bug with _gaq and pushing page views

v3.0.1 (2014-01-05)

• Fixing render bug.

v0.8.3 (2013-12-04)

• code cleaning.

v0.8.2 (2013-10-27)

• Adding forceRequests option, disables caches states and forces reload on back/forward navigation, useful in web apps where data changes states often.

v0.7.3 (2013-10-25)

• Adding check for support to public "open" method, falls back to standard window.location.href change.

v0.7.2 (2013-10-08)

• bug fixed

v0.7.1 (2013-10-01)

• Fixed console nonsense.

v0.6.3 (2013-04-21)

• Fixing issue with navigating away from current page - links now update state and prevent default if requesting the current url.

v0.6.2 (2013-03-29)

• Remove GUID, too many bugs, back to standard pop state handling

 

---

This awesome jQuery plugin is developed by benplum. For more Advanced Usages, please check the demo page or visit the official website.