search
HomeWeb Front-endJS TutorialJavaScript client verifies the size of uploaded images (compatible with IE and Firefox)_javascript skills

In my last post (translation), I talked about the circumstances under which each browser will pop up a script out of control prompt. For Internet Explorer, when the browser executes too many statements, it will stop executing the script. Other browsers will give prompts when the script continues to be executed for more than a certain period of time. The core issue we want to discuss is not how these browsers detect runaway scripts, but how we can make the scripts run faster to avoid these warnings.
There are basically four reasons why the script is out of control:
Too many operations are performed in the loop.
Bloated function body
Too much recursion
Too many DOM calls
In this post, I will focus on the first one: too many operations in loops. Loops operate synchronously, so the time it takes to execute a loop depends entirely on the number of loops. Therefore, there are two situations that will cause the loop execution time to be too long and directly cause the browser to be locked. One is that the loop body contains too many operations, and the other is that the number of loops is too many. Both of these situations can directly cause the browser to lock up and display a message indicating that the script is out of control.
The trick to solving this problem is to evaluate each loop with the following two questions:
Does this loop have to be executed synchronously?
Does the data in the loop have to be executed in order?
If the answer to both questions is no, you can choose to decompose the operations in the loop. The key is to determine the answers to the above two questions based on the specific context of your code. A typical loop might look like this:

Copy code The code is as follows:

for( var i=0; i process(items[i]);
}

At first glance, there is not much problem with this loop , whether it will run for a long time depends entirely on the number of loops. If there is no other code immediately following the loop that needs to depend on the result of the loop, then the answer to the first question is "no". You can also find that the loop only processes one value at a time and does not depend on the result of the previous loop, so the answer to the second question is also no. This means that the loop can be broken down in a way that doesn't lock the browser with a runaway script message.
In the book "Professional JavaScript, Second Edition", I recommend the following method for handling illusions with very large execution times:
Copy Code The code is as follows:

function chunk(array, process, context){
setTimeout(function(){
var item = array.shift ();
process.call(context, item);
if (array.length > 0){
setTimeout(arguments.callee, 100);
}
}, 100 );
}

The purpose of the chunk() function is to divide an array into small pieces for processing (this is also the origin of the name). We can pass three parameters. The array object to be processed, the processing function, and an optional context variable used to set the corresponding this object in the process() function. The first timer is used to handle the delay between operations (here it is set to 100 milliseconds, you can modify it according to actual needs). Each time this function is executed, the first object in the array will be taken out and passed to the process() function for operation. If there are still unprocessed objects in process() at this time, another timer will be started, using Waiting repeatedly. The loop mentioned above can use this function in the following method:
chunk(items, process);
It should be noted that the array here takes the form of a queue, and during the loop process , modifications will occur every time. If you want to modify the original state of the array, here are two ways: one is to use the concat() function to create a copy of the current array before passing it:
chunk(items.concat(), process);
Another option is to directly modify the chunk() function and modify it directly inside the function:
Copy the code The code is as follows:

function chunk(array, process, context){
var items = array.concat(); //clone the array
setTimeout(function(){
var item = items.shift();
process.call(context, item);
if (items.length > 0){
setTimeout(arguments.callee, 100);
}
}, 100);
}

Note that this method is much safer than just saving an index, because the contents of the array may change before the next timer takes effect.
The chunk() function mentioned here is just a starting point for optimizing loop performance. You can keep improving it to have more features as needed. For example, after all objects in the array have been processed, a function callback can be added. Regardless of whether you will modify the function in this way, this is just a JavaScript code development pattern that can help optimize array processing performance and avoid the warning that the script is out of control.
Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
VMware Horizon Client无法打开[修复]VMware Horizon Client无法打开[修复]Feb 19, 2024 pm 11:21 PM

VMwareHorizon客户端可帮助您便捷地访问虚拟桌面。然而,有时虚拟桌面基础设施可能会遇到启动问题。本文将讨论当VMwareHorizon客户端未能成功启动时,您可以采取的解决方法。为什么我的VMwareHorizon客户端无法打开?在配置VDI时,如果未打开VMWareHorizon客户端,可能会出现错误。请确认您的IT管理员提供了正确的URL和凭据。如果一切正常,请按照本指南中提到的解决方案解决问题。修复未打开的VMWareHorizon客户端如果您的Windows计算机上未打开VMW

VMware Horizon客户端在连接时冻结或停滞[修复]VMware Horizon客户端在连接时冻结或停滞[修复]Mar 03, 2024 am 09:37 AM

在使用VMWareHorizon客户端连接到VDI时,我们可能会遇到应用程序在身份验证过程中冻结或连接阻塞的情况。本文将探讨这个问题,并提供解决这种情况的方法。当VMWareHorizon客户端出现冻结或连接问题时,您可以采取一些措施来解决这一问题。修复VMWareHorizon客户端在连接时冻结或卡住如果VMWareHorizon客户端在Windows11/10上冻结或无法连接,请执行下面提到的解决方案:检查网络连接重新启动Horizon客户端检查Horizon服务器状态清除客户端缓存修复Ho

如何在VirtualBox中增加磁盘大小[指南]如何在VirtualBox中增加磁盘大小[指南]Mar 17, 2024 am 10:10 AM

我们经常遇到预定义磁盘大小没有空间容纳更多数据的情况?如果您在稍后阶段需要更多的虚拟机硬盘空间,则必须扩展虚拟硬盘和分区。在这篇文章中,我们将看到如何在VirtualBox中增加磁盘大小。增加VirtualBox中的磁盘大小重要的是要注意,您可能希望在执行这些操作之前备份您的虚拟硬盘文件,因为总是有可能出错。有备份总是一个好的做法。然而,该过程通常运行良好,请确保在继续之前关闭您的机器。有两种方法可以增加VirtualBox中的磁盘大小。使用图形用户界面扩展VirtualBox的磁盘大小使用CL

PHP MQTT客户端开发指南PHP MQTT客户端开发指南Mar 27, 2024 am 09:21 AM

MQTT(MessageQueuingTelemetryTransport)是一种轻量级的消息传输协议,通常用于物联网设备之间的通信。PHP是一种常用的服务器端编程语言,可以用来开发MQTT客户端。本文将介绍如何使用PHP开发MQTT客户端,并包含以下内容:MQTT协议的基本概念PHPMQTT客户端库的选取和使用实例:使用PHPMQTT客户端发布和

手机客户端是什么手机客户端是什么Aug 16, 2023 pm 01:40 PM

手机客户端是指一种在智能手机上运行的应用程序,通过原生客户端或Web客户端的形式为用户提供各种功能和服务。手机客户端可以分为原客户端和Web客户端两种形式,原生客户端是指使用特定编程语言和开发工具,为特定的操作系统编写的应用程序,Web客户端的优势在于跨平台兼容性好,可以不受操作系统限制在不同设备上运行,但相对于原生客户端,Web客户端的性能和用户体验可能有所降低。

如何在PHP中编写FTP客户端如何在PHP中编写FTP客户端Aug 01, 2023 pm 07:23 PM

如何在PHP中编写FTP客户端一、引言FTP(文件传输协议)是一种用于在网络上进行文件传输的协议。在Web开发中,我们常常需要通过FTP来上传或下载文件。PHP作为一种流行的服务器端语言,提供了强大的FTP功能,使我们可以方便地编写FTP客户端。本文将介绍如何使用PHP编写一个简单的FTP客户端,并提供代码示例。二、连接FTP服务器在PHP中,我们可以使用f

百度网盘网页无法启动客户端怎么解决?百度网盘网页无法启动客户端怎么解决?Mar 13, 2024 pm 05:00 PM

  很多朋友下载文件会先在网页上浏览,然后转入客户端下载。但有时用户会遇到百度网盘网页无法启动客户端的问题。针对这个问题,小编为大家准备了百度网盘网页无法启动客户端的解决办法,有需要的小伙伴可以参考一下哦。  解决办法  1、可能百度网盘不是最新版,手动打开百度网盘客户端,点击右上角的设置按钮,再点击版本升级。  如无更新,则会有如下提示,若有更新,请按照提示进行更新。  2、可能禁用了百度网盘的检测服务程序  有可能使我们自己手动或者使用安全软件自动禁用了百度网盘的检测服务程序。  请查看一下

如何移除Win11客户端上方的盾牌标志?如何移除Win11客户端上方的盾牌标志?Jan 05, 2024 am 11:21 AM

部分Win11使用者察觉他们的个人电脑中出现了一些软件图标旁边出现防盾标志的现象。通过此举保障计算机系统乃至其中存储的重要信息和资料免受侵害。如果你不喜欢的话,那么可以通过下面的方法来解决。win11客户端上面的盾牌标志怎么去除1、右键电脑上的任务栏,然后选择“任务管理器”2、再点击上面的“启动”3、在这里找到“Windowsdefender”然后右键选择“禁止”,然后重启电脑就可以了。

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Repo: How To Revive Teammates
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Powerful PHP integrated development environment

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

PhpStorm Mac version

PhpStorm Mac version

The latest (2018.2.1) professional PHP integrated development tool