前端学习一
一 进程与线程
线程是进程执行的最小单位,进程是系统分配任务的最小单位。
一个进程可执行最少一个线程。线程分为子线程和主线程。
主线程关闭则子线程关闭。
二 浏览器进程
浏览器是多进程多线程应用。
进程包括:
- 浏览器进程 负责程序交互
- 渲染进程 负责执行js等
- 网络进程 负责网络进程加载
渲染主线程负责执行js、vue,解释css、html等。
一个标签一个渲染进程。
渲染主线程执行最多次。
有线程将任务放到渲染主线程执行队列,渲染主线程执行队列从消息队列中获取任务执行。
同一类型任务在同一队列中。
消息队列包括:
- 微队列 执行优先级最高
- 交互队列 执行优先级中
- 延时队列 执行优先级低 执行回调
三 js异步理解
js为单进程语言。渲染主线程中执行js。
使用同步则可能导致渲染主进程堵塞。
渲染主线程执行队列其他任务无法执行。
浏览器采用异步方法可避免堵塞。
具体方法:
- 任务执行时,主线程将任务交给其他线程执行,主线程继续执行后续代码。
- 任务中回调函数,包装为任务,加入到延时队列中,待主进程执行。
以上方法最大限度保证单进程的流畅运行。
"主线程将任务交给其他线程执行"可以解释为,执行代码时,有线程将不同任务放到不同队列,根据队列执行优先级,主线程执行完全局任务后,获取任务执行。
交互事件任务进入交互队列。
Promise.resolve().then(function(){}) 将任务放入微队列。
三 js事件循环
渲染主线程循环执行,各个队列的任务,事件循环又叫消息循环。
类似于后端消息队列,有守护线程监听队列,其他线程执行对应数据,监听到有新数据就执行。
浏览器中开始死循环,执行消息队列中的任务,其他线程将任务插入队尾。
同类型的任务必须在同一队列,不同的任务应属于不同队列。
不同队列执行的优先级不同,微队列必须再存且执行优先级最高,其他队列优先级由浏览器自行决定。
四 js定时器是否精准
不精准
- 硬件没有原子钟
- 操作系统计时函数偏差,js计时执行操作系统函数
- 计时器实现时嵌套层级超过5层,则带有4毫秒时间差
- 受渲染主线程事件循环影响,计时器的回调在延时队列中,只能在渲染主线程空闲时运行,因此有偏差
原子钟为一个硬件设备,目前有芯片级原子钟。
国产芯片级微型原子钟:多领域应用,市场前景广阔!-电子发烧友网
五 示例
例:
const btn = document.getElementById("btn")function clickf(event){setTimeout(function(){console.log("setTimeout1")},0) Promise.resolve().then(function(){console.log("Promise1");})}btn.addEventListener('click', clickf(event));setTimeout(function(){btn.click(); },0) Promise.resolve().then(function(){console.log("Promise2");})function sleep(times){const date = Date.now();let currentDate = null;do {currentDate = Date.now();} while (currentDate - date < times);}function showaf(){let a=1console.log(a)}function showa(func){if (typeof func === 'function') {func(); // 执行回调函数}}function settimeout1(){console.log("setTimeout2")Promise.resolve().then(function(){console.log("Promise3");})console.log("setTimeout3") }setTimeout(settimeout1,0) showa(showaf)sleep(1000)let b=2console.log(b)
输出结果
调用顺序如下:
先是全局代码执行,依次推入延时队列任务1、微队列任务1、延时队列任务2。
根据推入顺序和队列的优先顺序,依次执行微队列任务1,延时队列任务1,延时队列任务2。
之后类推。
参考:
事件循环那点事_计算机硬件没有原子钟怎么理解-CSDN博客
相关文章:
前端学习一
一 进程与线程 线程是进程执行的最小单位,进程是系统分配任务的最小单位。 一个进程可执行最少一个线程。线程分为子线程和主线程。 主线程关闭则子线程关闭。 二 浏览器进程 浏览器是多进程多线程应用。 进程包括: 浏览器进程 负责程序交互渲染…...
【Python · PyTorch】卷积神经网络(基础概念)
【Python PyTorch】卷积神经网络 CNN(基础概念) 0. 生物学相似性1. 概念1.1 定义1.2 优势1.2.1 权重共享1.2.2 局部连接1.2.3 层次结构 1.3 结构1.4 数据预处理1.4.1 标签编码① One-Hot编码 / 独热编码② Word Embedding / 词嵌入 1.4.2 归一化① Min-…...
Spring Framework 路径遍历漏洞复现(CVE-2024-38819)
hu0x01 产品描述: Spring Framework 是一个功能强大的 Java 应用程序框架,旨在提供高效且可扩展的开发环境。它结合了轻量级的容器和依赖注入功能,提供了一种使用 POJO 进行容器配置和面向切面的编程的简单方法,以及一组用于AOP的模块。0x02 漏洞描述: Spring Framework 存…...
心法利器[122] | 算法面试的八股和非八股讨论
心法利器 本栏目主要和大家一起讨论近期自己学习的心得和体会。具体介绍:仓颉专项:飞机大炮我都会,利器心法我还有。 2023年新的文章合集已经发布,获取方式看这里:又添十万字-CS的陋室2023年文章合集来袭,更…...
实操给自助触摸一体机接入大模型语音交互
本文以CSK6 大模型开发板串口触摸屏为例,实操讲解触摸一体机怎样快速增加大模型语音交互功能,使用户能够通过语音在一体机上查询信息、获取智能回答及实现更多互动功能等。 在本文方案中通过CSK6大模型语音开发板采集用户语音,将语音数据传输…...
AJAX家政系统自营+多商家家政系统服务小程序PHP+Uniapp
一款同城预约、上门服务、到店核销家政系统,用户端、服务端、门店端各端相互依赖又相互独立,支持选择项目、选择服务人员、选择门店多种下单方式,支持上门服务和到店核销两种服务方式,支持自营和多商家联营两种运营模式࿰…...
LiveData源码研究
LiveData 源码分析 前言 用过MVVM的大概知道LiveData可以感知组件的生命周期,当页面活跃时,更新页面数据, 当页面处于非活跃状态,它又会暂停更新,还能自动注册和注销观测者,能有效避免内存泄漏和不必要的…...
Root软件学习
一、命令行输入下方命令打开root文件 root filename.root 二、在root命令行下输入.help查看root下可用的指令 .help输入.q是退出root命令行 .q 三、输入下方指令查看当前打开的root文件的目录 .ls 四、打印Hits树下的内容(print) 方框里是各种树文…...
研发文档管理系统:国内外9大选择比较
文章主要对比了9款国内外研发文档管理系统:1.PingCode; 2. Worktile; 3. 飞书; 4. 石墨文档; 5. 腾讯文档; 6. 蓝湖; 7. Confluence; 8. Notion; 9. Slab。 在企业研发过…...
centos 7.9 freeswitch1.10.9环境搭建
亲测版本centos 7.9系统–》 freeswitch1.10.9 一、下载插件 yum install -y git alsa-lib-devel autoconf automake bison broadvoice-devel bzip2 curl-devel libdb4-devel e2fsprogs-devel erlang flite-devel g722_1-devel gcc-c++ gdbm-devel gnutls-devel ilbc2...
嵌入式驱动开发详解17(CAN驱动开发)
文章目录 前言CAN简介CAN收发器CAN协议讲解电气特性传输协议数据帧遥控帧错误帧过载帧帧间隔 同步矫正 CAN控制器CAN控制器模式CAN接收器CAN波特率 CAN设备树分析CAN测试后续参考文献 前言 该专栏主要是讲解嵌入式相关的驱动开发,但是由于部分模块的驱动框架过于复…...
探索 Janus-1.3B:一个统一的 Any-to-Any 多模态理解与生成模型
随着多模态技术的不断发展,越来越多的模型被提出以解决跨文本与图像等多种数据类型的任务。Janus-1.3B 是由 DeepSeek 推出的一个革命性的模型,它通过解耦视觉编码并采用统一的 Transformer 架构,带来了一个高度灵活的 any-to-any 多模态框架…...
黑马头条day01 微服务搭建
1.请求调用流程 如http://localhost:8803/static/js/2.0195d7180dc783c3fe99.js这种静态资源,采用http的发送到本地8803端口的静态资源请求,而nginx配置的监听8801、8802、8803,所以请求走到nginx,nginx的admin配置文件 upstream…...
AI辅助编程工具对比:Cursor AI、Windsurf AI 和 GitHub Copilot
功能和特性 1. Cursor AI 基于VS Code构建,集成了GPT-4等多个AI模型,提供高级智能支持。支持AI代码补全、错误修正以及通过自然语言执行命令。具备多文件编辑和上下文理解能力,能够在复杂项目中提供跨文件的智能建议。提供标签功能…...
【Qt】qt安装
在工作一年之后,还是想做一个Qt的教程,遥想研一刚刚接触Qt,从0到1学习,没有什么参考书籍,网上的资料也不多,幸好Qt官方文档写得好,加上自己肯研究,才堪堪入门。 现在我想自己写一个…...
课设项目十:智能手电筒(使用金沙滩51单片机)
00 题目介绍 功能: 硬件设置: 使用51单片机连接光敏传感器、LED灯和手电筒开关按钮。 环境感知: 实时监测周围光照强度。 LED控制: 根据光照强度自动控制LED灯的开关。 手动控制: 提供手电筒开关按钮,…...
Oracle中COUNT函数对NULL和空字符串的处理方式
Oracle中,使用COUNT函数的时候,COUNT()和COUNT(null)得到的结果都是0,也就是说,如果我们COUNT中选择的那列属性中为null的或者的那行是不会被计数的。MySQL中count(null)效果和Oracle中一样,但是count()能正常计数。 在…...
OpenHarmony和OpenVela的技术创新以及两者对比
两款有名的国内开源操作系统,OpenHarmony,OpenVela都非常的优秀。本文对二者的创新进行一个简要的介绍和对比。 一、OpenHarmony OpenHarmony具有诸多有特点的技术突破和重要贡献,以下是一些主要方面: 架构设计创新 分层架构…...
Windows常用命令
该篇文章是博主不断从工作中总结而来,会持续不断更新 文件和目录管理命令 列出指定目录中的文件和子目录:dir 路径 更改当前工作目录:cd 路径 创建新目录:mkdir 目录名 删除空目录:rmdir 目录名 删除指定文件…...
牛客网 SQL2查询多列
SQL2查询多列 select device_id,gender,age,university //查询哪些字段 from user_profile //从哪个表中查找 每日问题 C 中面向对象编程如何处理异常? 在C中,面向对象编程(OOP)处理异常主要通过异常处理机制来实现。C 提供了…...
容器,网络基础
小结: 1、利用网桥和虚拟网卡 2、利用Veth Pair虚拟设备,一个网卡可以直接出现在另外一个网卡中 一个Linux容器能看见的“网络栈”,实际上是被隔离在它自己的Network Namespace当中的 “网络栈”,就包括了:网卡&#…...
Treap树堆【东北大学oj数据结构8-4】C++
题面 二叉搜索树会因为插入的数据的值可能变得不平衡,搜索/插入/删除操作的效率变得低效。例如,如果依次插入 n 个升序的数据,则树将看起来像一个列表,其高度将为 n,并且查询时间变得很长。一个解决策略是随意打乱要插…...
基于STM32的智电表系统课题设计思路:python友好界面、ADC、UART串口、数据分析
1. 项目选题与需求分析 1.1 选题背景和动机 随着社会的快速发展,电力的消耗不断增加,如何高效管理和监测用电成为了一个重要的课题。传统的电表只能提供简单的用电计量,无法满足现代家庭和工业对用电数据实时监控、远程控制及数据分析的需求…...
博弈论1:拿走游戏(take-away game)
假设你和小红打赌,玩“拿走游戏”,输的人请对方吃饭.... 你们面前有21个筹码,放成一堆;每轮你或者小红可以从筹码堆中拿走1个/2个/3个;第一轮你先拿,第二轮小红拿,你们两个人交替进行;拿走筹码堆…...
【人工智能解读】神经网络(CNN)的特点及其应用场景器学习(Machine Learning, ML)的基本概念
前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默, 忍不住分享一下给大家。点击跳转到网站 学习总结 1、掌握 JAVA入门到进阶知识(持续写作中……) 2、学会Oracle数据库入门到入土用法(创作中……) 3、手把…...
Spring Cloud与Spring Cloud Alibaba:全面解析与核心要点
Spring Cloud与Spring Cloud Alibaba:全面解析与核心要点 一、引言 在当今的分布式系统开发领域,Spring Cloud和Spring Cloud Alibaba都是极为重要的框架。它们为构建大规模、高可用、分布式的应用系统提供了丰富的工具和组件。本文将深入探讨Spring C…...
Java 泛型
1. 泛型 (1) 泛型:定义类、接口、方法时,同事声明了一个或多个类型变量(如<E>),称为泛型类、泛型接口、泛型方法、它们统称为泛型。可以在编译阶段约束要操作的数据类型 public static void main(String[] args) {//没加泛型 可以放任何…...
CentOS7 搭建 MQTT(mosquitto)环境并收发数据
零:说在前面 最近在研究物联网相关内容,需要接收 Modbus 协议的数据。上游数据源提出由对方整合数据后使用 MQTT 协议将数据发送过来,因此需要了解一下什么是 MQTT。 首先,它是一个类似 kafka 的“发布/订阅”模式的消息框架&…...
操作系统课后习题2.2节
操作系统课后习题2.2节 第1题 CPU的效率指的是CPU的执行速度,这个是由CPU的设计和它的硬件来决定的,具体的调度算法是不能提高CPU的效率的; 第3题 互斥性: 指的是进程之间的同步互斥关系,进程是一个动态的过程&#…...
Mac Goland dlv 升级
Mac Goland dlv 升级 问题表现 WARNING: undefined behavior - version of Delve is too old for Go version 1.22.1 (maximum supported version 1.21)查看当前Goland dlv 版本 ☁ ~ /Applications/GoLand.app/Contents/plugins/go-plugin/lib/dlv/mac/dlv version Delve…...
vue使用pdfh5.js插件,显示pdf文件白屏
pdfh5,展示文件白屏,无报错 实现效果图解决方法(降版本)排查问题过程发现问题查找问题根源1、代码写错了?2、预览文件流的问题?3、pdfh5插件更新了,我的依赖包没更新?4、真相大白 彩蛋 实现效果图 解决方法…...
【FFmpeg】FFmpeg 内存结构 ⑥ ( 搭建开发环境 | AVPacket 创建与释放代码分析 | AVPacket 内存使用注意事项 )
文章目录 一、搭建开发环境1、开发环境搭建参考2、项目搭建 二、AVPacket 创建与释放代码分析1、AVPacket 创建与释放代码2、Qt 单步调试方法3、单步调试 - 分析 AVPacket 创建与销毁代码 三、AVPacket 内存使用注意事项1、谨慎使用 av_init_packet 函数2、av_init_packet 函数…...
[Unity Shader] 【游戏开发】【图形渲染】Unity Shader的种类2-顶点/片元着色器与固定函数着色器的选择与应用
Unity 提供了不同种类的 Shader,每种 Shader 有其独特的优势和适用场景。在所有类型的 Shader 中,顶点/片元着色器(Vertex/Fragment Shader)与固定函数着色器(Fixed Function Shader)是两种重要的着色器类型。尽管它们具有不同的编写方式和用途,理解其差异与应用场景,对…...
Unity 动画曲线研究(Dotween插件)
动画的曲线的介绍 动画曲线(Animation Curve)是一种用于描述动画属性值随时间变化的图形工具。 我们可以通过给自己的动画片段设定不同的动画曲线,使动画效果具有不同表现力。 常见的动画曲线设定有: 线性(Linear&…...
适合小白的超详细yolov8环境配置+实例运行教程,从零开始教你如何使用yolov8训练自己的数据集(Windows+conda+pycharm)
目录 一、前期准备所需环境配置 1.1. 虚拟环境创建 1.2 下载yolov8源码,在pycharm中进行配置 1.2.1 下载源码 1.2.2 在pycharm终端中配置conda 1.3 在pycharm的terminal中激活虚拟环境 1.4 安装requirements.txt中的相关包 1.5 pip安装其他包 1.6 预训练…...
Linux中输入和输出基本过程
1.文件内核级缓冲区 前面在如何理解Linux一切皆文件的特点中提到为了保证在Linux中所有进程访问文件时的方式趋近相 同,在f ile 结构体中存在一个 files_operations 结构体指针,对应的结构体保存所有文件操作的函 数指针(这个结构体也被称为…...
二、FIFO缓存
FIFO缓存 1.FIFO缓存介绍2.FIFO缓存实现3.FIFO缓存总结 1.FIFO缓存介绍 FIFO(First-In-First-Out)缓存 是一种简单的缓存淘汰策略,它基于先进先出的原则来管理数据。当缓存达到容量限制并需要淘汰元素时,最先进入缓存的元素会被移…...
Linux_挂载nas
1、安装挂载nas必要的服务 yum -y install nfs-utils rpcbind 2、挂载nas sudo mount -t nfs -o vers3,nolock,prototcp,noresvport <NAS-IP>:/path/to/shared /yourNasPath mount 命令详解: -t :文件系统类型 ,这里指定的挂载类…...
uni-app开发AI康复锻炼小程序,帮助肢体受伤患者康复!
**提要:**近段时间我们收到多个康复机构用户,咨询AI运动识别插件是否可以应用于肢力运动受限患者的康复锻炼中来,插件是可以应用到AI康复锻炼中的,今天小编就为您介绍一下AI运动识别插件在康腹锻炼中的应用场景。 一、康复机构的应…...
现代密码学总结(上篇)
现代密码学总结 (v.1.0.0版本)之后会更新内容 基本说明: ∙ \bullet ∙如果 A A A是随机算法, y ← A ( x ) y\leftarrow A(x) y←A(x)表示输入为 x x x ,通过均匀选择 的随机带运行 A A A,并且将输出赋给 y y y。 ∙ \bullet …...
按照字幕拆解视频实战
1. 基本实现思路 字幕文件处理: 提取字幕内容和时间戳(如 SRT 文件格式)。解析字幕中的开始时间和结束时间。 视频切割: 使用字幕的时间戳,剪辑对应时间段的视频。每段字幕对应一个子视频。 输出子视频: …...
2.11.静态链表
一.静态链表的基本概念: 1.上图说明:索引为0处是头结点,头结点不存储数据,但存储下一个结点的数组下标,本例中头结点里存储的下一个结点的数组下标为2,即索引为2的结点为头结点后的第一个结点,以…...
分页查询在数据库中的好处
分页查询在数据库中的好处主要体现在以下几个方面: 提高性能: 减少数据传输:分页查询只返回请求的页面数据,而不是整个数据集,这减少了网络传输的数据量,降低了网络延迟和带宽消耗。减少内存使用࿱…...
电子应用设计方案-54:智能AI人工智能机器人系统方案设计
智能 AI 人工智能机器人系统方案设计 一、引言 随着人工智能技术的快速发展,智能 AI 机器人在各个领域的应用越来越广泛。本方案旨在设计一个功能强大、智能高效、交互友好的人工智能机器人系统,以满足不同场景下的用户需求。 二、系统概述 1. 系统目标…...
μC/OS-Ⅱ源码学习(6)---事件标志组
快速回顾 μC/OS-Ⅱ中的多任务 μC/OS-Ⅱ源码学习(1)---多任务系统的实现 μC/OS-Ⅱ源码学习(2)---多任务系统的实现(下) μC/OS-Ⅱ源码学习(3)---事件模型 μC/OS-Ⅱ源码学习(4)---信号量 μC/OS-Ⅱ源码学习(5)---消息队列 本文进一步解析事件模型中,事件标志…...
ASP.NET|日常开发中读写TXT文本详解
ASP.NET|日常开发中读写TXT文本详解 前言一、读取 TXT 文本1.1 使用StreamReader类 二、写入 TXT 文本2.1 使用StreamWriter类 三、文件编码问题3.1 常见编码格式 四、错误处理和性能考虑4.1 错误处理4.2 性能考虑 结束语优质源码分享 ASP.NET|日常开发中…...
《C 语言向量运算:点亮人工智能几何计算之路》
在人工智能蓬勃发展的时代,数学运算作为其坚实的基石发挥着不可替代的作用。而向量的点积与叉积运算,更是在人工智能的几何计算领域有着独特且关键的地位。今天,就让我们一同深入探讨如何在 C 语言中实现向量的点积、叉积运算,并领…...
HarmonyOS 获取进程相关的信息process 常用的几个方法
获取进程相关的信息,提供进程管理的相关功能。 process 1. EventListener 2. isIsolatedProcess 3. is64Bit 4. getStartRealtime 5. getPastCpuTime 导入模块 import { process } from kit.ArkTS; 属性 名称类型可读可写说明uidnumber是否进程的用户标识。…...
Linux 权限管理实践:精确控制用户对 systemctl 和 journalctl 命令的使用
前言 在 Linux 系统管理中,精确控制用户对特定命令的访问权限是一项关键的安全实践。使用 systemctl 和 journalctl 命令时,不当的权限设置可能会导致不必要的风险。本篇博客将详细讨论如何通过 sudoers 文件和 Polkit 策略为不同用户配置 systemctl 和…...
图像处理之滤波
中值滤波、均值滤波、高斯滤波和双边滤波是常见的图像处理技术,主要用于去噪和图像平滑。低通滤波和高通滤波用于处理图像中的频率成分。它们的主要区别在于它们所允许通过的频率范围。滤波、卷积、去噪、模糊、提取特征是一个意思。 卷积就是两个矩阵的乘法&#…...