Geek asks and answers

Highlighting the syntax of a dynamically created fragment on a web page using Prettify

I have a div in which I dynamically load a piece of code from the result of an AJAX request. Then I want to format it using prettify. It works, but it's damn slow. The code I use is as follows:

var jqxhr = $.get(fileName)
 .success(function(data) {
  $('#myDiv').html(data);
  prettyPrint();
  $('#myDiv').fadeIn();
})

In short, I make a GET request, I put the result of the request in #myDiv, I format it, and I have a fadeIn div. It takes some time, but it loads. But when I disappear from the div, the page remains unresponsive for a couple of seconds. I removed prettyPrint () and the page behaves fine. Any hint?

+3
source share
1 answer

I'm just thinking, but a few things worth mentioning.

, prettify.js 250 ( http://code.google.com/p/google-code-prettify/source/browse/trunk/src/prettify.js):

/**
 * Split {@code prettyPrint} into multiple timeouts so as not to interfere with
 * UI events.
 * If set to {@code false}, {@code prettyPrint()} is synchronous.
 */
window['PR_SHOULD_USE_CONTINUATION'] = true;

, , , . , false, fadeIn , prettyPrint.

, , prettyPrint , 250 , fadeIn , prettyPrint, , . prettyPrint (250 ) , , 250, , , , prettyPrint ONLY prettyPrints , ajax.

+3

More articles:


All Articles