js写的页面在浏览器上卡死 - 腾讯云开发者社区

文章/答案/技术大牛

发布

基于TensorFlow.js在浏览器上构建深度学习应用

节选自《深度学习TensorFlow.js：浏览器实战篇》第八章，已获授权。在前面的章节，我们讨论了各种JavaScript概念和运行在浏览器上的各种深度学习框架。...TensorFlow.js实现手势识别在本小节，我们使用TensorFlow.js在webcam上实现玩石头剪刀布游戏。在进行详细的解释之前，我们先去Github页面看看它是如何运行的。...对于学习少量数据集，我们在浏览器上可以进行实时模型训练。...这个常规的模式会确保，在更多的张量排队等待GPU处理时，浏览器得到合适的渲染。如果没有该模式浏览器会挂住，渲染web页面不可用。...这两个函数包括在浏览器上运行石头剪刀布游戏的有效代码。它们处理游戏的流程，监控TensorFlow.js迭代过程中设置的中间变量，检查用户当前在摄像头做的哪种手势，并相应的更新UI。

1.2K4 0

js兼容多浏览器的关闭当前页面

关闭当前页面，相信不少人在开发中都遇到过这个需求，但面对这么多的浏览器，要做到js的兼容还需要做特殊的处理。关于这方面网上有很多的资料，但大多都是复制粘贴的，没有达到兼容的效果，或者是效果不好。...//FF中需要修改配置window.close方法才能有作用，为了不需要用户去手动修改，所以用一个空白页面显示并且让后退按钮失效 //Opera浏览器旧版本(小于等于12.16版本)内核是Presto，...window.close方法有作用，但页面不是关闭只是跳转到空白页面，后退按钮有效，也需要特殊处理 var userAgent = navigator.userAgent; if (userAgent.indexOf

7.4K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

在元素上写事件和addEventListener()的区别

大家好，又见面了，我是你们的朋友全栈君。在元素上写事件和addEventListener()的区别 onclick添加事件不能绑定多个事件，后面绑定的会覆盖前面的。...addEventListener 是W3C DOM 规范中提供的注册事件监听器的方法。...如果你对事件捕获与冒泡不太了解请看：JS事件流介绍以及阻止事件冒泡示例： document.getElementById("item").addEventListener( 'click' , (event...时，浏览器采用bubbing（冒泡）– 建议使用！...addEventListener兼容写法： IE9之前浏览器使用element.attachEvent(type, callback) attachEvent(type, callback) type:

1.2K2 0

在 Windows上写 Python 代码的最佳组合！

在 Windows 上怎样做 Python 开发？是像大神那样使用纯文本编辑器，还是用更加完善的 IDE？到底是用自带的命令行工具，还是需要装新的 Terminal？...然而与 Linux 或 macOS 不同，在 Windows 上做开发总会遇到很多挑战，不论是文件编码、环境控制还是项目编译，开发过程中总会有一些神奇的收获。...因此如果我们在 Windows 上做 Python 开发，命令行工具就可以采用 MS Terminal，它能解决很大一部分的包安装、环境控制等问题。...当然，在使用 VS Code 时，你可能会发现其他有用的扩展。请在评论中分享你的发现和设置！单击活动栏（Activity Bar）上的「扩展」图标可以访问和安装新扩展和主题。...测试框架设置完成并显示测试后，你可以单击状态栏（Status Bar）上的 Run Tests 并从命令面板中选择一个 option 来运行所有测试：通过在 VS Code 中打开测试文件，单击状态栏上的

5.2K2 0

页面结构化在Android上的尝试

下面讲讲Lego在Android上一次小小尝试一，MVP简介 ? MVC太过常见这里不啰嗦。实际应用MVC当中，Activity占据打部分的工作，View和Controller的身份分不清。...Model 在MVP设计模式中， View：由Activity充当，并且响应生命周期 Model：还是原来的数据层，网络，缓存，解析等。...解耦，绝对的。不然抽这么多接口干嘛 2. 模块职责明确，层次清晰 3. Presenter可复用（在日迹的需求中，首页和4Tab公用一个Presnter） 4. 方便单元测试 5....三，Lego页面结构化前面铺垫这么多，终于到我要吹水的时候了。MVC，MVP，还有MVVM等MVX系列的设计模式，都是一种大而全的统一管理。在项目结构中最为关键其实是：分模块！ ?...根据页面结构，划分出一个个独立维护模块，这就是页面结构化。 ## 页面结构化（Lego）与组件化的区别 1. 组件处于通用性，是不带业务逻辑的。而页面结构化是带业务逻辑。 2.

1.3K6 0

页面结构化在 Android 上的尝试

下面讲讲Lego在Android上一次小小尝试一，MVP简介 ? MVC太过常见这里不啰嗦。实际应用MVC当中，Activity占据打部分的工作，View和Controller的身份分不清。...Model 在MVP设计模式中， View：由Activity充当，并且响应生命周期 Model：还是原来的数据层，网络，缓存，解析等。...三，Lego页面结构化前面铺垫这么多，终于到我要吹水的时候了。MVC，MVP，还有MVVM等MVX系列的设计模式，都是一种大而全的统一管理。在项目结构中最为关键其实是：分模块！ ?...页面被划分问一个个区域的模块，有自身的逻辑和规划。有人说，这不就是一个个组件嘛。然后“页面结构化”并不是指组件。...根据页面结构，划分出一个个独立维护模块，这就是页面结构化。页面结构化（Lego）与组件化的区别组件处于通用性，是不带业务逻辑的。而页面结构化是带业务逻辑。

1.1K5 0

JS 在浏览器端的运行机制

先来看几个问题 1、JS为什么是单线程？ JS的单线程，与他的用途有关。作为浏览器脚本语言，Js的主要用途就是与用户互动，以及操作DOM。这决定了它只能是单线程。...试想一下，假设现在有process1、process2两个线程，process1在某个DOM节点上添加了内容，process2删除了这个节点，那这时浏览器应该以哪个线程为准呢？...这个现象对于用户而言，就是 “页面卡死”，用户体验极差。所以，JS需要异步任务。...几个知识点执行栈所有同步任务都在主线程上执行，形成一个执行栈，执行栈是存储函数调用的栈结构，遵循先进后出的原则任务队列只要异步任务有了运行结果，就在 “任务队列” 中放置一个事件任务类型任务类型可分为...也就是说，如果主线程执行了10秒，那这个任务就会在10+3秒后执行 JS 在浏览器端的运行机制 - 小鑫の随笔：https://xiaoxina.cc/p/4b4d.html

6963 0

Umi的headScripts属性，在html页面头部添加js

headScripts 配置里的额外脚本，默认值为数组，数组项为字符串或对象。...Array Default：[] 大部分场景下用字符串格式就够了，比如： export default { headScripts: [`alert(1);`, `https://a.com/b.js...> 如果要使用额外属性，可以用对象的格式， export default { headScripts: [ { src: '/foo.js', defer: true },...> alert('你好'); 未经允许不得转载：w3h5 » Umi的headScripts...属性，在html页面头部添加js

6K1 0

Umi的headScripts属性，在html页面头部添加js

headScripts 配置里的额外脚本，默认值为数组，数组项为字符串或对象。...Array Default：[] 大部分场景下用字符串格式就够了，比如： export default { headScripts: [`alert(1);`, `https://a.com/b.js...> 如果要使用额外属性，可以用对象的格式， export default { headScripts: [ { src: '/foo.js', defer: true },...script> alert('你好'); 未经允许不得转载：w3h5-Web前端开发资源网 » Umi的headScripts...属性，在html页面头部添加js

1.3K2 0

如何在浏览器上跑深度学习模型？并且一行JS代码都不用写

OpenGL / WebGL 允许我们能够在未安装 CUDA 的环境中使用 GPU。目前这是在浏览器中使用 GPU 的唯一方式。...在浏览器上运行神经网络模型已经不是一件多么新鲜的事了。Andrej Karpathy 提出的ConvNetJS，及 Google 的 DeepLearning.JS 都能够实现这种想法。...还有一部分的 glue code 编译在 LLVM 上，用于设置并启动 OpenCL 内核。然后我们在本地的机器上运行该模型。...设备的代码被编译到 WebGL 平台上，我们可以在Firefox 浏览器上运行该模型。从以上得到的结果我们可以看到，TVM OpenGL 后端与 OpenCL 有相似的性能。...这可能是由于 Emscripten 生成了 asm.js，使得模型在 Firefox 浏览器中的运行效率得到了显著优化。这个更新迈出了将深度学习模型自动编译到浏览器的第一步。

1.7K5 0

cocos2d-js 各浏览器上的表现

如果不行，就只能在canvas上做小块的区域，减少每帧的变化。 1、PC的Chrome（webgl）首先看看官方的performance test。粒子系统达到最大值3000也毫无压力。 ?...普通的小人转啊转，1000个以内不成问题，超过1000性能开始下滑。 ? 再自己写一个单图多sprite不断旋转的测试。左侧是没有开批处理的情况，1600个小人就开始撑不住了。...这个测试在PC上没太多意义，因为可能底层自动做了批处理。这个测试主要是为了后边手机上运行。...2、小米1的微信内嵌浏览器（跟google浏览器效率类似，应该是内嵌了google浏览器）本来想在手机上跑官方的测试，但发现死活打不开。算了。。。...测试程序尺寸是720*1280，由于尺寸太大，这个也是造成运行不流畅的原因。每帧都要重绘，是有点吃力。微信浏览器跟谷歌浏览器类似，操作也是类似的（双击放大）。

2K3 0

js判断页面是否是通过浏览器后退按钮返回打开的

# 解决方法利用浏览器的window.performance.navigation.type属性 window.performance.navigation.type window.performance...是W3C性能小组引入的新的API，目前IE9以上的浏览器都支持。...我们可以在官方说明中找到PerformanceNavigation接口的详细介绍： [Exposed=Window] interface PerformanceNavigation { const...(用户通过刷新，包括JS调用刷新接口等方式访问页面) 2 : TYPE_BACK_FORWARD Navigation where the history handling behavior is set...(客户端重定向，例如使用Refresh pragma伪指令的客户端重定向，在本规范中不视为HTTP重定向。

17K2 0

JS在浏览器和Node下是如何工作的？

浏览器中的情况假设你在浏览器中打开一个页面，其使用了一个单独的 JS 执行线程。该线程负责处理所有事，如滚动页面、打印页面上的某些东西、监听 DOM 事件（比如点击）等等。...在每条记录（entry）上，栈的状态也称做栈帧（stack frame）。若是哪个栈帧上的函数调用发生了错误，JS 会将其代码执行快照打印成堆栈追踪（stack trace）。...但如果浏览器不得不用同一个 JS 引擎执行以上这些特性，则用户体验将不堪设想。因为即便只是用户滚动一下页面，也会在后台触发许多事情。...在 Node.js 中会怎样当同样的事情发生在 Node.js 中时，就得做的更多些了 -- 因为 node 所承诺的能力也更强。在浏览器中，我们被能在后台做什么掣肘。...，这二者虽然还是在单一线程上运行，而独立的 worker 线程则承担了提供异步 I/O 操作的功能。

2.1K1 0

一个请求的组成、静态页面和动态页面、HTML, CSS和JS、浏览器渲染的过程

静态页面和动态页面静态页面纯粹的HTML文件, 简单地说当前的页面文件就存储在服务端, 我们请求的静态页面实际上就是请求对方服务器中的文件. 通过返回不同的HTML文件来完成不同请求的显示效果....动态页面和静态页面的区分绝不是指页面上的动画效果最常见的就是各大企业网站动态页面动态页面是指除了HTML以外, 通过ajax在不直接刷新页面的前提下, 完成了和服务端的数据交互....javascript和xml的缩写在不直接刷新页面的前提下, 完成了和服务端的数据交互....并通过javascript回调函数完成对页面内容的修改, ajax和服务端交互的数据格式通常为json. json js对象标记法, 用来表示对象关系 js中的对象: {a: 1, b: null}...浏览器渲染的过程接收到HTML文件后开始构建DOM(Doucment Object Model)树. CSS来计算DOM树各个节点的坐标, 大小等CSS属性, 开始布局.

1.6K1 0

教程 | 用摄像头和Tensorflow.js在浏览器上实现目标检测

选自Medium 作者：Mike Shi 机器之心编译参与：Pedro、刘晓坤 Tensorflow.js 是一个能在你的浏览器里运行的全新深度学习库。...首先，YOLOv2 只在功能强大的桌面级设备上以 40 帧每秒的速度运行，而这个条件大多数用户都达不到。同时，YOLOv2 的模型文件是 Tiny YOLO 的五倍大，这将会导致网络卡死。...将数字转换为边框以及数字我不准备深入探讨这个话题，因为对 YOLO 的后处理可以拿来单独写几篇博客了。相反，我会专注于我在将 Python 版本转换到 Javascript 时遇到的难题。 1....不幸的是，在 Tensorflow.js 中，如果你在 tf.slice 上尝试这样操作，它只会默默地失败。 3....现在我们知道如何通过静态图像或网络摄像头抓取数据，可以将大多数 ML 模型从 Python 转换为 Tensorflow.js 并在浏览器中运行它们。

2.3K4 1

css与js写的原生modal 框，点击页面其他地方渐变消失

height: 100%; width: 100%; position: fixed; z-index: 9998; } JS...$('.quick-shot-content').fadeOut(150); } ); }); 结语我是个前端渣渣，在使用...MUI的时候找了好久他的modal，最后发现跟我的实现不一样，于是自己写了一个原生的。

3104 0

在浏览器上，我们的隐私都是如何被泄漏的？

本文就将介绍第三方脚本如何利用浏览器的内置登录管理器（也称为密码管理器），在没有用户授权的情况下检索和泄露用户信息的。...上图显示了这一过程：首先，用户填写页面上的登录表单，并要求浏览器保存登录信息（跟踪脚本不在登录页面上显示）。然后，用户访问含有第三方跟踪脚本的同一网站上的另一个页面。...在我们的测试中，Chrome 不会自动填充密码字段，除非用户点击或触摸页面。所以，对于密码管理器中保存的用户名（通常是电子邮箱地址）和密码，第三方脚本可以创建表单并自动填充。...这个攻击并不是最新产生的，类似攻击已经在许多浏览器报告和学术论文中讨论了至少 11 年，以前的讨论大部分都集中在当前功能的安全影响以及自动填充功能的安全可用性权衡上。...浏览器厂商的困境。很明显，同源政策对于今天网络上的信任关系是不适用的，虽然各种安全防御措施会有一定的帮助，但浏览器厂商还是会面临一个两难的问题：他们是否应该防御这个类似的漏洞？

1.7K10 0

WebIDE：在浏览器中写代码的时代即将来临？

去年 12 月，在号称云计算风向标的 AWS re:Invent 大会上，AWS 宣布推出 Cloud9，这是用于编写、运行和调试代码的基于云的 IDE，它可以直接运行在浏览器中，相对于本地的 IDE...，如 Git、Docker、Node.js、Python 等；利用 Web 终端，你可以在浏览器进行npm install等操作；一个完整的 IDE 所包含的大部分功能，包括智能提示、代码自动补全等...支持实时的代码调试功能（发布时仅限 Node.js 可用）；支持协作编码，需要对方也拥有 AWS 账户；包括对 AWS Lambda 的内建支持，这意味着你可以在 Cloud9 里新建、管理、保存新的...客户端，运行于浏览器的 IDE，这个可以参考开源项目 Ace Editor，AWS Cloud9 就是在这个项目基础上开发的。类似项目有 Theia 等。运行容器。编译和运行用户代码的容器。...2017 年 4 月，AWS 发布了持续交付工具链 CodeStar，它将开发者在运维上消耗的精力降到了最低，开发者几乎只用关心写代码就好了。

2.3K3 0

解决H5页面在微信浏览器中打开 input file 在安卓上没有拍照选项

大家好，又见面了，我是你们的朋友全栈君。...有时候我们会在微信公众号里开发会遇到上传图片的功能，当你写的时候，在IOS上可以成功调起拍照和图库两块，在安卓手机上只能调取图库而没有拍照功能，解决办法：给input...input type=”file” accept=”image/*” /> //调用相机，图片或者相册（两者都行）加上了capture=camera”属性之后安卓手机就直接调用了相机，没有了图库的选项...camcorder”> // 调取视频 //调取音频注：capture表示，可以捕获到系统默认的设备

4.9K3 0

Vue.js如何写一个简单的原生js模块，浏览器中的表现如何？

在这篇文章中，我将向您展示如何编写一个JavaScript模块到一个文件中，并在vue.js APP中使用它。您可以在浏览器中就做到这一切而不需要Babel或者Webpack！...，您只需要在命令行上使用HTTP服务器模块的静态服务器即可： # This will serve the project directory at localhost:8080 $ http-server...要查看这个应用程序，您当然需要使用支持JavaScript模块的浏览器。...> js"> 这WebPack版本将在不同浏览器中的原生模块支持。...在这里，它是在Firefox中，注意build.js加载的并不是模块： ?

3.3K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

基于TensorFlow.js在浏览器上构建深度学习应用

js兼容多浏览器的关闭当前页面

在元素上写事件和addEventListener()的区别

在 Windows上写 Python 代码的最佳组合！

页面结构化在Android上的尝试

页面结构化在 Android 上的尝试

JS 在浏览器端的运行机制

Umi的headScripts属性，在html页面头部添加js

Umi的headScripts属性，在html页面头部添加js

如何在浏览器上跑深度学习模型？并且一行JS代码都不用写

cocos2d-js 各浏览器上的表现

js判断页面是否是通过浏览器后退按钮返回打开的

JS在浏览器和Node下是如何工作的？

一个请求的组成、静态页面和动态页面、HTML, CSS和JS、浏览器渲染的过程

教程 | 用摄像头和Tensorflow.js在浏览器上实现目标检测

css与js写的原生modal 框，点击页面其他地方渐变消失

在浏览器上，我们的隐私都是如何被泄漏的？

WebIDE：在浏览器中写代码的时代即将来临？

解决H5页面在微信浏览器中打开 input file 在安卓上没有拍照选项

Vue.js如何写一个简单的原生js模块，浏览器中的表现如何？

扫码

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐