Follow

Snapshots

Snapshot management

Pugpig presents your content using a web view, but during navigation it shows a captured image (or snapshot) of the web view instead. If your content changes over time, you must ensure that the web view matches the snapshot or you will see an unpleasant transition when Pugpig switches between the image of the web view and the web view itself.

 

Waiting for a snapshot

Ideally you should wait for the snapshot to complete before you start changing the page (e.g. starting CSS animations). Pugpig can trigger a Javascript function once the snapshot is taken like this:

<meta name="callbackWhenSnapshotFinished" 
content="yourJavascriptFunctionName"/>

 

Delaying a snapshot

Sometimes you want to build your page by manipulating the DOM using Javascript. If you do this, you must tell Pugpig to wait until you're done before taking the snapshot:

<meta name="delaySnapshotUntilReady" content="yes"/>

When you've build your page, tell Pugpig that it can proceed with the snapshot. We use a helper:

var Messaging =(function(){
 function Messaging(){}

 Messaging.fn = Messaging.prototype;
 Messaging.fn.postMessage = function( message ){ //avoid popup on safari and IE if(window.location.protocol.search(/https?/) === -1){
var iframe = document.createElement("IFRAME");
iframe.setAttribute("src","pugpig://"+ message);
document.documentElement.appendChild(iframe);
iframe.parentNode.removeChild(iframe);
iframe = null;
}
 };
return new Messaging();
}());

and then invoke it like this:

postMessage('onPageReady');

 

Pausing snapshots

Occasionally you will have a page that requires heavy user interaction. Usually Pugpig continues snapping other pages in the background, which can decrease responsiveness. You can tell Pugpig to temporarily stop snapshotting:

<meta name="stopSnapshotting" content="yes"/>

This technique should only be used sparingly because it stops all snapshotting for as long as the user is on the page with the meta tag.

 

Single-load pages

Occasionally you will have pages that must not be loaded more than once at the same time (for example, they access database storage in a non-concurrent way). You should mark such pages like this:

<meta name="concurrent" content="no"/>

This tag only has an effect in the web reader.

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments

Powered by Zendesk