Question

我有一个div，我从AJAX请求的结果中动态加载一段代码。然后我想用美化来格式化它。它有效，但它很慢。我使用的代码如下：

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

简而言之，我执行GET请求，我将请求的结果放在#myDiv中，我将其格式化，然后淡入div。它需要一段时间但负载。但是当我淡出div时，页面仍然没有响应几秒钟。我删除了prettyPrint（），页面表现得非常完美。任何提示？

Answer 1

我只是猜测，但有几件值得一提。

根据消息来源，prettify.js的默认模式是使用continuation运行，并避免每次占用CPU超过250ms（我在http://code.google.com/p/google-code-prettify/source/browse/trunk/src/prettify.js引用来源）：< / p>

/**
 * 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，并在您传递给prettyPrint调用的回调函数中添加fadeIn调用。

假设我已经理解正确，如果你设法在异步模式下运行prettyPrint，那么它当时应该最多停留250ms，并且通过调用fallIn来调用传递给prettyPrint中调用的回调函数，它在完成所有语法高亮显示之前，它不会淡入。如果当时对prettyPrint（250ms）的一系列调用仍然感觉很慢，那么其他建议可能是将最大时间值减少到小于250，或者另外找出如何确保prettyPrint只是打印从更新的元素你的ajax电话。

使用Prettify在网页中突出显示动态生成的代码段

1 个答案: