- objective-c - iOS 5 : Can you override UIAppearance customisations in specific classes?
- iphone - 如何将 CGFontRef 转换为 UIFont?
- ios - 以编程方式关闭标记的信息窗口 google maps iOS
- ios - Xcode 5 - 尝试验证存档时出现 "No application records were found"
所以我通过 Google 的 PageSpeed Insights 运行我的网站它告诉我可以通过延迟加载非关键资源来改进 CSS 交付。特别是它提到了包含很棒的字体:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
我想我可以通过简单地将它放在结束 body 标记之前的脚本之前来延迟它的加载,如下所示:
...
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="js/min/scripts.min.js"></script>
</body>
</html>
但是!查看 Google 的 documentation on delivery speed 时,我找到了两种不同的解决方案。
在我的母语(荷兰语;您可以在右下角更改文档的语言)中,文档指出我应该将非必要的 css 放在结束的 html 标记中。这对我来说似乎非常奇怪。 尝试通过 JS 访问文件时,这不会使事情复杂化吗? 为什么不将它放在结束 body 标记之前?
...
</body>
</html>
<link rel="stylesheet" href="small.css">
但是,在英文文档中,事情变得更加复杂并且需要 JavaScript:
...
<script>
var cb = function() {
var l = document.createElement('link'); l.rel = 'stylesheet';
l.href = 'small.css';
var h = document.getElementsByTagName('head')[0]; h.parentNode.insertBefore(l, h);
};
var raf = requestAnimationFrame || mozRequestAnimationFrame ||
webkitRequestAnimationFrame || msRequestAnimationFrame;
if (raf) raf(cb);
else window.addEventListener('load', cb);
</script>
</body>
</html>
为什么需要 JS?这不是有点过头了吗?
我的方法有什么问题?为什么不能在结束 body 标记之前加载非关键 CSS?
最佳答案
外部样式表将阻止页面呈现,直到它完全加载。 Google 建议将文档的最初可见(关键,首屏)部分所需的样式放在 <style>
中。头部中的标签(
唯一可以定义非内联样式的地方
)以避免这种渲染阻塞。阅读 HTML 后,非关键样式(您登陆页面时不会直接看到的样式)作为外部样式表添加到头部内。。这样它会首先呈现,然后才会加载所有其他样式。所有这些都是为了尽快向访问者展示内容,而不是让她/他等待超过必要的时间。
它认为在大多数情况下,它超出了 Google 推荐的范围,他们只是在几毫秒内变得怪异——他们的方法只有在 CSS 很大的情况下才有意义。但我认为很难,如果不是几乎不可能的话,用当前可用的工具进行维护。例如,如果它是一个回访者,他在较早的时候向下滚动了页面并会自动再次登陆那里(Opera 是一个对此非常顽固的浏览器)?仅此一项,您就需要更多的 JS,并且可能需要处理样式。那不是一个好方法。即使是初始显示,您也必须直接在头部填充一些媒体查询,以便在不诉诸全屏部分的情况下尝试正确处理。这一切都适得其反,而且过于复杂。
放 <style>
或 <link>
head 部分之外的标签可能有效,但这是不正确的。我敢肯定谷歌不再站在那个立场上了,而且英文版是唯一有效的文件。编辑 - 请参阅评论了解这方面的细微差别。
即使按照 Google 的方式进行操作并在 PageSpeed Insights 上获得“好”分数,也没有太大意义。您仍然可以隐藏整个页面,并且仅在一切 已加载(这并不罕见)时才显示它,而不会影响分数。
我个人决定忽略它,直到他们实现了一个功能,您可以在该功能中异步加载 CSS(就像您可以使用 JavaScript 和 async
一样),就像文档中宣布的那样。它仍然需要一个特殊的用例,但至少你可以为它构建一个框架。我自己不喜欢插件。
Google 文档中缺少一件重要的事情——在禁用 JavaScript 时提供回退。幸运的是,有了 HTML5,<noscript>
标签可用于此:
<head>
/* other stuff */
<noscript><link rel="stylesheet" href="small.css"></noscript>
</head>
旁注 - Google 自己的分析脚本将阻止完美的 PageSpeed 得分,因为他们在其上设置了(逻辑上)快速缓存过期。算了吧。
关于css - 根据 Google 优化 CSS 交付,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32423767/
这里的这个问题对 updating Google Sheets charts linked to Google slides 有一个简洁的解决方案. function onOpen() { var
我正在尝试将 Google 表单添加到 Google 类作业中,但似乎不可能。 首先,它在这里 ( https://developers.google.com/classroom/reference/
出于某种原因,无论我做什么以及我如何尝试,这个日期格式化程序都不起作用。工具提示仍然显示错误的格式。你可以试试代码here . 在代码中我必须注释掉 formatter.format(dataTabl
我目前正在使用访问 token 和刷新 token 从 Google Analytics Reporting API (v4) 中提取数据。当我致力于自动从 Google Analytics 中提取数
我已在 Google 云端硬盘中创建了一个文件夹,例如测试一下,放入3个文件 a.jpg, b.jpg, c.jpg 我希望在同一帐户下的 Google 电子表格中访问文件,例如生成图像文件的链接,可
电子表格 A 是欢迎新移民来到我们小镇的团队的主数据源。它里面有大量非常敏感的数据,不能公开,哪怕是一点点。 (我们谈论的是 child 的姓名和出生日期以及他们在哪里上学……保证电子表格 A 的安全
有没有办法在 Google 文档中编写 Google Apps 脚本以从 Google 表格中检索仅限于非空白行的范围并将这些行显示为表格? 我正在寻找一个脚本,用于使用 Google Apps 脚本
有没有办法在 Google 文档中编写 Google Apps 脚本以从 Google 表格中检索仅限于非空白行的范围并将这些行显示为表格? 我正在寻找一个脚本,用于使用 Google Apps 脚本
尝试检索存储在 google firebase 中名为条目的节点下的表单条目,并使用谷歌工作表中的脚本编辑器附加到谷歌工作表。 我已将 FirebaseApp 库添加到谷歌表脚本编辑器。然后我的代码看
是否可以将我的 Web 应用程序的登录限制为仅限 google 组中的帐户? 我不希望每个人都可以使用他们的私有(private) gmail 登录,而只能使用我的 google 组中的用户。 最佳答
我们想使用 Google 自定义搜索实现 Google 附加链接搜索框。在谷歌 documentation , 我发现我们需要包含以下代码来启用附加链接搜索框 { "@context"
我想将特定搜索词的 Google 趋势图表添加到我的 Google Data Studio 报告中,但趋势不是数据源列表中的选项。我也找不到嵌入 JavaScript 的选项。是否可以将趋势图表添加到
是否可以将文件从 Google Drive 复制到 Google Cloud Storage?我想它会非常快,因为两者都在类似的存储系统上。 我还没有看到有关无缝执行此操作的任何方法的任何信息,而无需
之间有什么区别 ga('send', 'pageview', { 'dimension1': 'data goes here' }); 和 ga('set', 'dimension1', 'da
我正在尝试记录每个博客站点作者的点击率。 ga('send', 'pageview'); (in the header with the ga code to track each page) ga(
我设置了 Google Tag Manager 和 2 个数据层变量:一个用于跟踪用户 ID,传递给 Google Analytics 以同步用户 session ,另一个用于跟踪访问者类型。 在使用
我在我们的网站上遇到多个职位发布的问题。 我们在加拿大多个地点提供工作机会。所有职位页面都包含一个“LD+JSON ”职位发布的结构化数据,基于 Google 的职位发布文档: https://dev
公司未使用 Google 套件,使用个人(消费者)帐户(甚至是 Google 帐户)违反公司政策。 需要访问 Google Analytics - 没有 Google 帐户是否可能? 谢谢 最佳答案
我想分析人们使用哪些搜索关键字在 Play 商店中找到我的应用。 那可能吗?我怎么能这样做? 最佳答案 自 2013 年 10 月起,您可以关联您的 Google Analytics(分析)和 Goo
Google Now 和 Google Keep 中基于时间和位置的提醒与 Google Calendar 事件提醒不同。是否有公共(public) API 可以访问 Now 和 Keep 中的这些事
我是一名优秀的程序员,十分优秀!