我的页面中的资源加载速度太慢

时间:2015-10-05 15:31:27

标签: jquery html css css3

我有一个网页,页面上有一些jQuery根据放在其中的文本执行div的大小调整(读取更多/读取更少)。

我使用的是自定义本地字体,90%的时间它工作正常,但有时则超出估算所需的空间。

使用调试器我发现只有在页面显示我正在使用的任何字体或图标(在我的资源文件夹中)之前执行脚本时才会发生这种情况。 Chrome调试器显示渲染的字体是“DejaVu Sans”。我假设它使用此计数来执行jQuery,之后它用我的自定义字体替换字体。

我想这是字体方面的某种加载时间问题,因为它与缓存不一致。但我能在这做什么呢?有没有办法在dom准备好之前确保资源已加载并可用?

3 个答案:

答案 0 :(得分:1)

我已经有一段时间了,但你必须使用http://www.fontsquirrel.com/tools/webfont-generator进行优化 如果您在https://www.google.com/fonts上使用字体而不是使用

答案 1 :(得分:1)

$().ready()和朋友将在解析DOM后立即运行;它不会等到图像和样式表和东西被加载。您可能想要查看JS本地load事件。来自MDN文档:

  

当资源及其相关资源完成加载时会触发load事件。

所以,这样的事情应该有效:

<script>
  document.addEventListener("load", function(event) {
    console.log("DOM, images, stylesheets etc. all present");
  });
</script>

答案 2 :(得分:0)

这只是在加载字体之前运行JQuery的问题。 我使用了Web Font Loader自定义模块(因为我的字体不是google或font squirrel)和回调来解决这个问题。