前端
0斌果0
怀着破碎的花瓶,朝着光的方向不断前进!
展开
-
Web Worker的使用
为什么要用到worker因为javascript采用的是单线程模型,也就是所有的任务都只能在一个线程上执行,当解析到一个运算量较大的js的时候,后面的任务只能等前面的js解析完才能进行其他操作。所以就会出现“卡死“的状态。Web Worker它的作用就是解决上诉问题。它可以通过加载一个脚本文件,进而创建一个独立工作的线程,在主线程之外运行。从而营造一个多线程的运行环境,充分利用CPU的资源,减轻主线程的负担。worker中的限制(1)同源限制分配给 Worker 线程运行的脚本文件,必须与主线程的原创 2020-08-22 15:12:18 · 922 阅读 · 0 评论 -
在JS中同步修改vue中的变量
问题:在处理一个功能上遇到一个问题:在vue组件中,引入了一个JS文件,在JS文件动态创建了一些DOM节点,需要侦测dom节点中内容的变化同时改变vue中组件的内容。思考:因为它是单独的一个JS文件,里面动态生成的dom可以通过oninput来侦测输入内容的变化,但要实时更新到vue组件中,那只能找他们的连接点或者搭桥(借助vuex、localStorage这些全局变量),想着可以利用对象类型,因为其是将引用放在堆中,真正的值存放在栈中,通过传递其引用作为桥梁来达到JS文件中修改vue中值的效果。解决:原创 2020-08-15 15:01:23 · 4896 阅读 · 1 评论 -
vue源码解析之实例挂载
vm.$mount([elementOrSelector])用法:如果vus.js实例在实例化时没有收到el选项,则它处于“未挂载”状态,没有关联的DOM元素。我们可以使用vm.$mount手动挂载一个未挂载的实例。如果没有提供elementOrSelector参数,模板将被渲染为文档之外的元素,并且必须使用原生DOM的API把它插入文档中。这个方法返回实例自身,因而可以链式调用其他实例方法。注:在使用vue-cli搭建vue项目的时候,其已经帮我们挂载好了,可能很少会接触到这个方法。但我们仍需要了解其原创 2020-08-09 00:11:35 · 375 阅读 · 0 评论 -
CSS动画文字闪烁问题
动画文字闪烁问题1.动画加载后,浏览器没有发现任何合成因素,因此选择最佳策略:将页面的全面内容绘制再单个背景层上。2.当执行transition动画的时候,我们明确了将合成添加到元素中-具有tranform属性过度的动画。但是由于隐私合成层的原因,位于动画元素之上的属性会全部提升为合成层。3.提升到合成层总是会导致重新绘制:浏览器必须为该元素创建一个新的纹理并将其从上一层移除。4.新增图层之后,必须将新的图层传送到CPU,已获得用户将再屏幕上看到的最终图像合成。这取决与层数,纹理大小和内容的复杂度,原创 2020-07-20 23:33:19 · 1462 阅读 · 0 评论 -
vue-cli打包后打开后index.html 文件白屏问题
打开 dist index.html 文件发现白屏。打开调试后发现什么也没有,也没有报错。根据以往的经验如果是文件路径报错,一般在根目录下新建 vue.config.js配置publicPath就行了,或者直接在vue-ui上的配置文件加个点就好。publicPath:"./"各种百度,发现都是叫我配publicPath,但我已经配好了。百思不得其解,自己慢慢摸索终于发现了问题:不知道怎么自己的mode变成了history,默认是hash模式var router = new Router({原创 2020-07-17 23:16:41 · 750 阅读 · 0 评论 -
Http请求两次的问题
在之前有位老哥问我,之前在本地测试的时候测试接口没问题,只发送一次。但请求服务器上的接口时,就出现了两次请求的问题。第一次发送的是options类型的请求,第二次才是正常的请求。如果后端设置了频繁请求拦截的话,那么第二次真正的请求的无法请求到数据。由来ajax请求遵循同源策略(协议、域名、端口号必须一致),如果其中一个不同,就会造成跨域。浏览器同源策略的本质是:**一个域名的JS在未经允许下,不能读取另一个域名的内容。**但浏览器并不阻止你向另一个域名发送请求。跨域只是浏览器强加给JS的规则,浏览器其原创 2020-07-16 23:51:20 · 5241 阅读 · 0 评论 -
JavaScript事件循环
什么是事件循环? javascript是一门单线程且非阻塞脚本语言,这意味着JavaScript代码在执行的任何时候都只有一个主线程来处理所有任务。而非阻塞是指当代码需要处理异步任务时,主线程会挂起这个任务,当一部任务处理完毕后,主线程再根据一定规定去执行相应回调。 事实上,当任务处理完毕后,JavaScript会将这个事件加入一个队列中,我们称这个队列为事件队列。被放入事件队列中的事件不会立即执行其回调,二十等待当前执行栈中的所有任务执行完毕后,主线程会去查找事件队列中是否有任务。 异步任原创 2020-07-09 23:40:46 · 129 阅读 · 0 评论 -
VUE源码解析之变化侦测(三)
在之前的两篇博客已经写了vue的变化侦测实现原理。大致回顾下,主要VUE实现变化侦测主要是:开始通过Observer类遍历每个属性,然后通过Object.defineProperty对属性进行数据劫持,每当其触发getter的时候通过依赖收集器(Dep)来收集依赖(Watcher)。当侦听属性发生变化的时候,会触发setter进而触发遍历Dep里面的依赖Watcher,然后Watcher会通知其他地方做相应的操作。Array则是通过拦截器来进行相应的侦听,原理也是差不多,不同的只是Dep收集的位置和侦听数原创 2020-06-07 01:29:07 · 159 阅读 · 0 评论 -
大厂是如何开发部署前端项目
作者:张云龙链接:https://www.zhihu.com/question/20790576/answer/32602154来源:知乎著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。作者:张云龙,前百度工程师,曾负责百度 前端集成解决方案 的核心设计与开发工作。我现在称这个领域为【前端工程】。 没错,这是我最爱唠叨的问题域。这是一个非常有趣的 非主流前端领域,这个领域要探索的是如何用工程手段解决前端开发和部署优化的综合问题,入行到现在一直在学习和实践中。 在我的印象中转载 2020-06-04 12:51:34 · 610 阅读 · 0 评论 -
VUE源码解析之变化侦测(二)
在VUE源码解析之变化侦测(一)中知道VUE中Object的变化是靠setter来追踪,只要一个数据发生变化,就会触发setter,进而遍历告知Dep里面的Watcher,Watcher再进一步进行相应的处理。 接下来探讨下VUE中的Array侦测。VUE中ARRAY的数据侦测array和object大有不同,如下例子:this.list.push("binguo") 当我们时候list方法的时候,根本没有触发到getter/setter方法,所以我们得通过第二方法侦测。你可能会想到了,原创 2020-06-03 01:23:43 · 181 阅读 · 0 评论 -
从输入URL到页面展示中的知识点
当我们输入一个网址,到浏览器呈现出页面这段时间内到底发生了什么事?这是面试常考题,总体来说经历了以下几个过程。1.浏览器输入网址并按下回车按钮2.浏览器查找当前的url是够存在缓存,并比较缓存是否过期3.DNS解析URL对象的IP4.将根据IP和服务器建立TCP连接(三次握手)5.HTTP发起请求。6.服务器处理请求并返回请求报文,浏览器接手HTTP响应。7.构建DOM树,渲染页面...原创 2019-12-12 21:05:46 · 464 阅读 · 0 评论