我一直在使用带有脚本标签的 defer 属性,但刚刚发现 <link rel="prefetch" as="script" 是一个东西,但找不到更好或首选的东西?这些方法之间有什么区别?

<link rel="prefetch" href="library.js" as="script">
<,javascript,html"/>
	














首页 > 解决方案 > 哪个更好

我一直在使用带有脚本标签的 defer 属性,但刚刚发现 <link rel="prefetch" as="script" 是一个东西,但找不到更好或首选的东西?这些方法之间有什么区别?

<link rel="prefetch" href="library.js" as="script">
<

问题描述

我一直在使用带有脚本标签的 defer 属性,但刚刚发现 <link rel="prefetch" as="script" 是一个东西,但找不到更好或首选的东西?这些方法之间有什么区别?

<link rel="prefetch" href="library.js" as="script">

对比

<script defer="" src="library.js"></script>

从移动应用程序将图像上传到 AWS S3

我正在学习 AWS 和 Flutter,以便为大学的一门学科开发像 Instagram 这样的移动应用程序(Android)。

我的问题是,是否有办法将应用程序中的图像直接发送到 S3 存储桶,并将与该图像相关的 URL 存储在 DynamoDB 中。

我将 Flutter 用于前端(它不使用 AWS SDK)并开发后端 AWS Api Gateway (Api REST)、Lambda 和 DynamoDB。

我读到如果将图像转换为base64,则可以在请求正文中传递图像,但我担心这是否是最佳方法。我在想,如果我以这种方式传递图像,Api Gateway 和 Lambda 的 AWS 免费层将被消耗,因为考虑到我将上传并处理以保存在 S3 存储桶中的请求主体的大小几张图片。

图像的尺寸为 1080x1350px,所以我认为大小将在 500KB 左右,我也打算上传视频。

我将不胜感激任何形式的指导,因为我是 AWS 的新手。

标签: javascripthtml

解决方案


它们是两种截然不同的东西。<link rel="prefetch">向浏览器指示将需要某些资源(不一定是 JavaScript)。如果您通过 JavaScript 动态加载资源,这很有用。

<script defer>当 JavaScript 代码执行时改变。一旦浏览器遇到该元素,它就会被获取,但它仅在文档完全加载时运行。

在这些情况下,它们可能是相似的:

  • <link rel="prefetch"><head><script>最后<body>
  • <script defer>在里面<head>

在这两种情况下,JavaScript 资源是同时获取的,但在第一个示例中,JavaScript 在整个加载之前执行<body>,而在第二个示例中,JavaScript 在整个文档加载之后执行(即所有元素位于 DOM 中)。


关于哪个更好:我会改为使用<script defer><head>因为:

  • 它不会阻止 HTML 解析器,
  • 它具有更好的兼容性和
  • 少写点东西。

推荐阅读