首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

创建一个欢迎 cookie 利用用户在提示框中输入的数据创建一个 JavaScript Cookie,当该用户再次访问该页面时,根据 cookie 中的信息发出欢迎信息。…

创建一个欢迎 cookie 利用用户在提示框中输入的数据创建一个 JavaScript Cookie,当该用户再次访问该页面时,根据 cookie 中的信息发出欢迎信息。...cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。...的欢迎词。而名字则是从 cookie 中取回的。 密码 cookie 当访问者首次访问页面时,他或她也许会填写他/她们的密码。密码也可被存储于 cookie 中。...当他们再次访问网站时,密码就会从 cookie 中取回。 日期 cookie 当访问者首次访问你的网站时,当前的日期可存储于 cookie 中。...日期也是从 cookie 中取回的。

2.7K10

提升 Web 核心性能指标的 9 个建议

Image 加载优化 为了优化 LCP 的时间,我们可以让使静态 HTML 中的图片资源更易于被发现,这有可以让浏览器的预加载扫描程序更早的找到并加载它。...BF Cache 我们去年看到 CLS 的最大改进之一是在 Chrome 中推出的回退缓存或 BF 缓存中。另外,Safari 和 Firefox 也已经上线这个功能一段时间了。...动画的渲染需要浏览器重新布局页面,因此需要更多的工作,即使脱离正常文档流的绝对定位元素,例如使用 top 或 left 移动内容,也会将其计算为布局移位,即使它不会移动任何周围其他的内容,内容本身也在移动...网站响应性的关键在于确保不阻塞主线程,因为这会导致浏览器无法响应用户输入。 分解长任务 第一个建议是识别并分解长任务,相当于给浏览器一些喘息的空间,以便它能够响应用户输入。...JavaScript 是单线程且贪婪的,一旦它占用了 CPU,它就会尽可能地一直保持它,直到它不能处理或者处理完毕为止。在这个例子中,即使有五个子进程,所有的五个进程也是会一个接一个地执行。

61720
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    并发模型与事件循环 mdn

    每一个消息都关联着一个用以处理这个消息的函数。 在事件循环期间的某个时刻,运行时从最先进入队列的消息开始处理队列中的消息。为此,这个消息会被移出队列,并作为输入参数调用与之关联的函数。...在下面的例子中,"this is just a message" 将会在回调获得处理之前输出到控制台,这是因为延迟参数是运行时处理请求所需的最小等待时间,但并不保证是准确的等待时间。...基本上,setTimeout 需要等待当前队列中所有的消息都处理完毕之后才能执行,即使已经超出了由第二参数所指定的时间。...处理 I/O 通常通过事件和回调来执行,所以当一个应用正等待一个 IndexedDB 查询返回或者一个 XHR请求返回时,它仍然可以处理其它事情,比如用户输入。...遗留的例外是存在的,如 alert 或者同步 XHR,但应该尽量避免使用它们。注意,例外的例外也是存在的(但通常是实现错误而非其它原因)。

    1.2K40

    进阶|掌握着几点,JavaScript 性能优化能有质的飞跃

    •空闲工作 如果你有一个耗时很久,需要持续运行的任务时,请确保把它分成很小的块,以便允许主线程对用户的输入操作做出反应。不应该出现一个任务延迟超过50ms的用户输入。...•加载 页面加载应该在1000毫秒内完成。在移动设备上,这是一个很难达到的目标,因为它涉及到页面的互动,而不仅仅是在屏幕上渲染和滚动。...你是否正在做一个对时间要求较为严格的库来处理用户输入和/或动画?如果没有,你需要把时间和精力转移到更有影响力的地方。 编写高性能代码并不是那么重要,因为对于宏观计划通常没有什么影响。...所以在这部分中,应该了解两件事情: 1. 虽然 JavaScript 解析的时间长度和包的大小不是完全线性的,但是需要处理的 JavaScript 越少,则所花时间越少。 2....另外,Webpack 需要运行时间来工作,并将其注入到它生成的所有 .js 文件中。

    38320

    你的博客用不着什么JavaScript框架

    最后还有成本优势:LAMP stack 服务器得按月付费;Netlify 的免费套餐(每月构建 300 分钟)应该可以轻松覆盖零成本个人博客的需求。...哪怕你的网站没有任何互动元素(链接除外,即使没有 Gatsby,它们也无需 JavaScript 即可工作),你的用户也必须下载这部分 JavaScript,仅仅是为了将你的网站变成单页应用程序(SPA...从网站 /Web 应用的大致区别来看,React 是用于构建 Web 应用的,这种应用需要有响应用户输入或实时获取数据的交互式 UI;而博客只是一个网站而已。...用更少的 JavaScript 构建 Gatsby 网站 这使我陷入了一个两难境地:使用 Gatsby 开发网站是绝妙的体验;但是开发体验(DX)应该永远排在用户体验(UX)之后。...有一些 JavaScript 库可以做到这一点,其中最流行的似乎是 Prism——你可以在客户端中运行它,但由于我们使用的是 JavaScript SSG,因此可以在构建时运行它,并将语法高亮显示所需的

    4.1K10

    你还在用 swagger?试试这几款在线文档生成神器!!

    它的功能类似金山WPS中的word或者微软office中的word的文档编辑工具。它可以用来写文档、建表格、插图片、生成pdf。...它支持swagger接口数据,提供了多种生成文档的方式,非常容易部署。使用redoc-cli能够将您的文档捆绑到零依赖的 HTML文件中,响应式三面板设计,具有菜单/滚动同步。...缺点:在线调试功能需要安装插件,用户体检稍微有点不好,主要是为了解决跨域问题,可能有安全性问题。不过要解决这个问题,可以自己实现一个插件,应该不难。...个人建议:这种在线文档生成工具提供了另外一种思路,swagger是在代码中加注解,而apidoc是在注解中加数据,代码嵌入性更小,推荐使用。...权限管理,ShowDoc上的项目有公开项目和私密项目两种。公开项目可供任何登录与非登录的用户访问,而私密项目则需要输入密码验证访问。密码由项目创建者设置。

    3.5K20

    求你别再用swagger了,给你推荐几个在线文档生成神器

    gitBook是一款文档编辑工具。它的功能类似金山WPS中的word或者微软office中的word的文档编辑工具。它可以用来写文档、建表格、插图片、生成pdf。...当然,以上的功能WPS、office可能做得更好,但是,gitBook还有更最强大的功能:它可以用文档建立一个网站,让更多人了解你写的书,另外,最最核心的是,他支持Git,也就意味着,它是一个分布式的文档编辑工具...使用redoc-cli能够将您的文档捆绑到零依赖的 HTML文件中,响应式三面板设计,具有菜单/滚动同步。...个人建议:这种在线文档生成工具提供了另外一种思路,swagger是在代码中加注解,而apidoc是在注解中加数据,代码嵌入性更小,推荐使用。...权限管理,ShowDoc上的项目有公开项目和私密项目两种。公开项目可供任何登录与非登录的用户访问,而私密项目则需要输入密码验证访问。密码由项目创建者设置。

    2.9K30

    JavaScript 性能优化技巧分享

    本文从加载、上下文、解析、编译、执行和捆绑等多个方面来讲解 JavaScript 的性能优化技巧,以便让更多的前端开发人员掌握这方面知识。 什么是高性能的 JavaScript 代码?...空闲工作 如果你有一个耗时很久,需要持续运行的任务时,请确保把它分成很小的块,以便允许主线程对用户的输入操作做出反应。不应该出现一个任务延迟超过50ms的用户输入。...加载 页面加载应该在1000毫秒内完成。在移动设备上,这是一个很难达到的目标,因为它涉及到页面的互动,而不仅仅是在屏幕上渲染和滚动。...你是否正在做一个对时间要求较为严格的库来处理用户输入和/或动画?如果没有,你需要把时间和精力转移到更有影响力的地方。 编写高性能代码并不是那么重要,因为对于宏观计划通常没有什么影响。...所以在这部分中,应该了解两件事情: 1. 虽然 JavaScript 解析的时间长度和包的大小不是完全线性的,但是需要处理的 JavaScript 越少,则所花时间越少。 2.

    1.1K150

    【前端基础】JS基础学习笔记整理

    当web容器输出内容到浏览器时,这个内容是包含js源代码的,此时,JavaScript可以操作浏览器上的一切内容,在浏览器上提供用户交互,页面美化,增加页面的智能性。...即使在字符串中,如果在引号中包括了一个硬换行,那么你会得到一个解析错误(未结束的字符串)。...通常来说,因为窗口在 JavaScript的文档对象模型(DOM)对象层次的顶层,JavaScript就假设 Window已经存在了,你不必去在 JavaScript程序中刻意写上它,也就是说 “window.location...表单当中的用户输入内容将发送给 Action所指定的页面,该页面做相应的处理,比如获得用户的输入,存入到数据库系统中去。...比如:在图 2中的用户名称的输入框 Text的名称为UserId,它的 ID为 txtUserId,那么可以通过 var UserId=document.getElementById("txtUserId

    2.3K70

    JavaScript 测试教程 part 1:用 Jest 进行单元测试

    本文是 JavaScript 测试教程 系列中的第1部分 1. JavaScript测试教程-part 1:用 Jest 进行单元测试 2....被测试的单元可以是函数、模块和类等。单元测试应该相互隔离并且彼此独立。对于给定的输入,用单元测试检查结果,通过尽早发现问题并避免退化,可以帮助你确保程序的每个部分都能按预期工作。...它可能是打开的真正浏览器,并且在其中运行测试。它也可能是无头浏览器环境,即没有用户界面运行的浏览器。E2E 测试的重点是在我们正在运行的程序中模拟实际用户。...它的目标之一是通过现成可用的工具提供“零配置”体验。它已经存在了一段时间,并且快速可靠。 1npm install --save-dev jest 别忘了把它添加到 npm 脚本中。...它包含三个参数:测试的名称,包含期望值的函数和超时(以毫秒为单位)。超时默认为 5 秒,并指定如果测试花费的时间太长,则中止测试之前要等待多长时间。 expect 函数用于测试值。

    2.9K20

    HTML 5.1 — 14 项新增特性及使用案例

    而我们在这里所要呈现的是在版本 5.1 中被引入的新的功能特性和功能提升。你不需要动 JavaScript 就可以利用上这些功能特性。...element.forceSpellCheck() 将强制用户代理在文本元素上报告检查出来的拼写和语法错误,即使用户从来没将输入聚焦在该元素上。...在下面所提供的代码中,这个 value 是硬编码的,不过在实际的使用场景中,这个值是随机生成的。...更多的输入项类型 ? HTML 输入项元素扩充了三个输入类型 – week, month 以及 datetime-local。 正如其名称所表明的,头两个元素可以让用户选择一个星期值和一个月份值。...根据浏览器的支持情况不同,它们俩都会被渲染成一个下拉显示的日历,让你可以选择一年中一个特定的星期或者月份。 datatime-local 表示的是一个日期和时间的输入域, 不过没有时区设置。

    77120

    用TensorFlow.js进行人体姿态估计:在浏览器中即可实时查看人体姿态

    而且由于我们已经开源了这个模型,JavaScript开发人员可以用几行代码来修改和使用这个技术。更重要的是,这实际上可以帮助保护用户隐私。...单人姿势检测器更快,更简单,但图像中只显示一个主体。我们先讲它,因为它更容易懂。 在高级姿态估计发生在两个阶段: 一个输入的RGB图像通过卷积神经网络馈送。...此外,该算法的吸引人的特性是性能不受输入图像中人数的影响。无论是15人还是5人,计算时间都是一样的。...在较高的水平上,这控制了返回姿势之间的最小距离。这个值默认为20,这在大多数情况下可能是好的。它应该增加/减少,以滤除不太准确的姿势,但只有在调整姿势置信度分数不够好时。...这可能是一个很好的截止点。如果你想知道更多关于模型和实现的技术细节,我们邀请您继续阅读下面的内容。 好奇心:技术深潜 在本节中,我们将介绍关于单姿态估计算法的更多技术细节。

    5.3K40

    网站性能最佳体验的34条黄金守则(转载)

    当你在浏览器地址栏中输入www.dudo.org时,DNS解析服务器就会返回这个域名对应的IP地址。DNS解析的过程同样也是需要时间的。...如果用户修改过地址薄,时间戳就会用来确定新的URL和缓存响应并不匹配,浏览器就会重要请求更新地址薄。         即使你的Ajxa响应是动态生成的,哪怕它只适用于一个用户,那么它也应该被缓存起来。...在JavaScript中,由于需要下载的文件体积变小了从而节省了响应时间。精简JavaScript中目前用到的最广泛的两个工具是JSMin和YUI Compressor。...25、减少DOM访问       使用JavaScript访问DOM元素比较慢,因此为了获得更多的应该页面,应该做到: ·     缓存已经访问过的有关元素 ·     线下更新完节点之后再将它们添加到文档树中...·     避免使用JavaScript来修改页面布局       有关此方面的更多信息请查看Julien Lecomte在YUI专题中的文章“高性能Ajax应该程序”。

    1.4K10

    10个基于web的JavaScript最优秀的应用程序库和框架

    QUnit 许多库提供的测试功能有很多不足之处。即使您使用脚本,手动测试复杂的应用程序也会很麻烦,而且需要花费大量的时间——如果它能找到所有的错误的话。...尽管有它这么给力,Ember.js的快速入门教程只需要5分钟就可以完成。当然,标准教程需要的时间要长得多,但是能产生更多受人尊敬的结果,如下所示: ?...基本上,reactivity指的是在Vue中自动更新一个JavaScript对象,并且不引人注意地更新Vue模板。 Vue是为任何具有HTML、CSS和JavaScript工作知识的人而构建的。 ?...类似地,Jest是一个“零配置”的JavaScript测试解决方案,旨在使用React进行开箱即用的测试。...没有人想要重新工作他们的应用程序,因为它使用的JavaScript库不再可用。尽管现在大多数现代JavaScript库和框架都非常可靠,但您仍然需要确保它们与用户所依赖的所有设备和浏览器兼容。

    2.2K20

    操作系统基础知识操作系统的主要特性:分类可以通过命令接口和程序接口方式把它的服务和功能提供给用户程序在执行前已经实现地址转换的方法是静态重定位,执行中为动态重定位.实现角度看,线程分为用用户空间的用户

    操作系统的主要特性: 并发,共享,异步,虚拟性 分类 批处理系统 用户将一批作业提交给操作系统后就不再干预,由操作系统控制它们自动运行 批处理操作系统的特点是:多道和成批处理。...分时 实时 可以通过命令接口和程序接口方式把它的服务和功能提供给用户 程序在执行前已经实现地址转换的方法是静态重定位,执行中为动态重定位....实现角度看,线程分为用用户空间的用户线程和核心空间的内核线程 死锁的必要条件 互斥条件,占有和等待条件,不可抢占,请求保持循环等待 进程控制原语 阻塞原语,唤醒原语 低级调度算法 先来先服务,OPT,LRU...操作系统I/O软件层组织 中断处理程序,设备驱动程序,设备独立性软件,用户层软件 文件目录控制块FCB不可缺少 文件名,物理空间地址

    1.1K70

    使用 MongoDB 之前应该知道的 14 件事

    在服务器上使用默认端口安装而不启用身份验证是在自找麻烦,尤其是可以在查询中运行任意 JavaScript 时(例如把$where 作为注入攻击的载体)。...尤其是,除非有非常好的理由要使用mapReduce、group 或 $where,否则你应该 在配置文件中设置 javascriptEnabled:false,禁用 JavaScript。...遗憾的是,没有索引,你会遇到其他问题。因为文档会从头到尾扫描,找到一个接近数组尾部的元素需要花更多的时间, 大部分处理这个文档的操作都会变慢 。...忘记哈希对象中键序的意义 在 JSON 中,一个对象包含一个无序集合,而该集合中有零个或多个名/值对,其中名是一个字符串,而值是一个字符串、数值、布尔值、空、对象或数组。...多文档、多语句事务现在是原子的了,它允许开发人员调整用于获取锁的时间,过期挂起事务以及修改隔离级别。

    1.9K30

    告别“丝袜哥”,推荐这几个在线文档生成神器!

    它的功能类似金山WPS中的word或者微软office中的word的文档编辑工具。它可以用来写文档、建表格、插图片、生成pdf。...当然,以上的功能WPS、office可能做得更好,但是,gitBook还有更最强大的功能:它可以用文档建立一个网站,让更多人了解你写的书,另外,最最核心的是,他支持Git,也就意味着,它是一个分布式的文档编辑工具...它支持swagger接口数据,提供了多种生成文档的方式,非常容易部署。使用redoc-cli能够将您的文档捆绑到零依赖的 HTML文件中,响应式三面板设计,具有菜单/滚动同步。...个人建议:这种在线文档生成工具提供了另外一种思路,swagger是在代码中加注解,而apidoc是在注解中加数据,代码嵌入性更小,推荐使用。...权限管理,ShowDoc上的项目有公开项目和私密项目两种。公开项目可供任何登录与非登录的用户访问,而私密项目则需要输入密码验证访问。密码由项目创建者设置。

    1.3K30

    Web渲染那些事儿

    即使第三方JS无法避免,使用服务器渲染来减少自己的JS成本,也能提供更多的性能“预算”。但是,这种方法有一个主要缺点:在服务器上生成页面有一定耗时,可能会导致较慢的首字节时间(TTFB)。...预渲染通常需要更多的 JavaScript 来实现交互,并且这些 JS 往往比静态渲染使用的渐进增强方法更复杂。 服务器渲染 vs 静态渲染 服务器渲染并不是银弹——它的动态特性带来显著的计算成本。...构建依赖大型 JavaScript 的 CSR 应用时,应该考虑积极的代码分割,并确保延迟加载 JavaScript——“只在需要时提供所需内容”。...rehydration 后的 SSR 主要缺点,是它会对可交互时间(TTI)产生显著的负面影响,即使它改善了首次绘制(FP)。...对于每个基本静态的部分,相应的 JavaScript 代码会被转换为惰性引用和装饰功能,将其客户端占用空间减少到接近于零。部分 Rehydration 方案伴随着自身的问题和妥协。

    1.9K30

    网站性能优化

    当你在浏览器地址栏中输入[url]www.wangjishun.com[/url]时,DNS解析服务器就会返回这个域名对应的IP地址。DNS解析的过程同样也是需要时间的。...但是,使用Ajax并不能保证用户不会在等待异步的JavaScript和XML响应上花费时间。在很多应用中,用户是否需要等待响应取决于Ajax如何来使用。...如果用户修改过地址薄,时间戳就会用来确定新的URL和缓存响应并不匹配,浏览器就会重要请求更新地址薄。 即使你的Ajxa响应是动态生成的,哪怕它只适用于一个用户,那么它也应该被缓存起来。...在JavaScript中,由于需要下载的文件体积变小了从而节省了响应时间。精简JavaScript中目前用到的最广泛的两个工具是JSMin和YUI Compressor。...减少DOM访问 使用JavaScript访问DOM元素比较慢,因此为了获得更多的应该页面,应该做到: 缓存已经访问过的有关元素 线下更新完节点之后再将它们添加到文档树中 避免使用JavaScript来修改页面布局

    3.1K40

    HTML 表单和约束验证的完整指南

    即使在今天,开发人员仍花费大量时间编写函数来检查字段值。这在现代浏览器中仍然必要吗?可能不是。在大多数情况下,这实际上取决于您要尝试做什么。...但首先,这里有一个重要的警告信息: 客户端验证是一项很好的功能,它可以在应用程序浪费时间和带宽将数据发送到服务器之前防止常见的数据输入错误。它不能替代服务器端验证! 始终清理服务器端的数据。...(但请避免使用它,因为它很少有用) search 搜索输入字段 submit 一个表单提交按钮 tel 电话号码输入字段 text 文本输入字段 time 没有时区的时间选择器 url URL 输入字段...,占位符文本就会消失——即使是一个空格。...除非您的客户主要是 IE 用户,否则没有必要实现您自己的回退验证功能。所有 HTML5 输入字段都可以在 IE 中使用,但可能需要更多的用户努力。

    8.4K40
    领券