rxjs 适合处理复杂的异步调度场景, 异步调度限制器是一个非常好的例子,基于rxjs 的核心代码 只需要 不超过10行。 通过mergemap操作符 concurrent : 限制订阅的最大量。(当源Observable发出的内部观察变量的数量超过concurrent设置的限制时,mergeMap Read More
posted @ 2023-02-07 19:42 break_happy Views(118) Comments(0) Diggs(0) Edit
ES7中的依赖注入是一种技术,用于解决模块之间的耦合性问题。它允许我们将模块之间的依赖关系抽象化,从而使它们更容易重构,测试和更新。它也可以帮助我们更好地管理应用程序的可复用模块,以提高代码的可维护性。 proxy 依赖注入 ES7中的依赖注入可以通过使用 JavaScript 的 Proxy 和 Read More
posted @ 2023-01-11 23:17 break_happy Views(89) Comments(0) Diggs(0) Edit
vm (Virtual Machine)是 Node.js 顶级模块之一,vm 模块可以在 V8 虚拟机的独立上下文-运行时环境中编译和执行 JavaScript 代码,防止代码对系统产生不可预知的影响。 Node.js使用V8 JavaScript引擎作为实际执行环境,并使用vm和vm2模块实现沙 Read More
posted @ 2021-09-27 14:58 break_happy Views(916) Comments(0) Diggs(0) Edit
简介 Module federation 解决了一次构建可以拆分为多次构建的问题,并且构建产物也可以为其他应用提供服务。 本质上 webpack 的能力是用来增强不同 bundle 之间 code sharing 的能力。 Multiple separate builds should form a Read More
posted @ 2021-09-26 09:45 break_happy Views(1110) Comments(0) Diggs(0) Edit
基础类型 let isDone: boolean = false; let decLiteral: number = 6; let name: string = "bob"; 数组 let list: number[] = [1, 2, 3]; let list: Array<number> = [ Read More
posted @ 2021-09-23 17:17 break_happy Views(107) Comments(0) Diggs(0) Edit
概念:装饰器作用是在在不会影响原有方法或类的功能的前提下,对它们进行增强。 属于AOP面向切面编程下的一种设计方案,更“优雅”地把“辅助功能逻辑”从“业务逻辑”中分离。( 比如将日志记录,性能统计,安全控制,异常处理等代码从业务逻辑代码中解耦出来出来)。 本质:装饰器语法本质是 Object.def Read More
posted @ 2021-08-31 11:19 break_happy Views(78) Comments(0) Diggs(0) Edit
MVVM(model<->viewmodel<->view) 数据双向绑定(data-binding)是mvvm的核心思想,View 和 Model 之间没有联系,通过 ViewModel 进行交互。用户操作 View,ViewModel 感知到变化,通知 Model 发生相应改变;反之当 Mode Read More
posted @ 2021-08-18 23:32 break_happy Views(122) Comments(0) Diggs(0) Edit
child_process child_process.spawn(command, args,options) 支持 stream 方式操作输入输出,适合数据量大的情况;可以执行任何命令;不创建 V8 实例;可以创建常驻的后台进程 对于异步命令不支持callback, 可以使用process.on Read More
posted @ 2021-08-18 21:15 break_happy Views(160) Comments(0) Diggs(0) Edit
元编程(Meta-Programming)是一种编程技巧,它指的是程序可以操作自身或其它代码或语言结构,而不是仅仅操作数据。 在ES7 中提供了 Reflect API, Proxies, Decorators 等特性,可以被使用来实现元编程。 Reflect API : ES7中的Reflect Read More
posted @ 2021-08-07 12:20 break_happy Views(41) Comments(0) Diggs(0) Edit
vue3 的响应式编程,数据拦截方案采用proxy 实现。 基础版 proxy只实现了对象顶层的数据监听。子项监听需要我们自己实现。 demo所示设置a2的值时,proxy会触发一次对a1的get,并不会触发set操作。 const data = { a1: { a2: 1, }, }; const Read More
posted @ 2021-08-06 14:16 break_happy Views(112) Comments(0) Diggs(0) Edit
与angular 不同,vue的指令不是通过依赖注入实现的,而是通过全局的注册系统。指令通过调用 Vue 实例的 Vue.directive 方法并传入指令的名称和定义来注册。 一旦注册,该指令可以在该Vue实例或其后代渲染的任何模板中使用,只需在其名称前加上v-前缀即可。 指令定义是一个JavaS Read More
posted @ 2021-08-06 09:02 break_happy Views(32) Comments(0) Diggs(0) Edit
基础版本usestate var _state; // function useState(initialValue) { _state = _state | initialValue; // function setState(newState) { _state = newState; //re Read More
posted @ 2021-08-05 09:15 break_happy Views(98) Comments(0) Diggs(0) Edit
Webpack本质基于事件流,流程就是将各个插件串联执行,实现此功能的核心就是tapable。 tapable 是一个类似于 Node.js 中的 EventEmitter的库,更专注于自定义事件的触发和处理。webpack 通过 tapable 将实现与流程解耦,所有具体实现通过插件的形式存在。 Read More
posted @ 2021-08-05 08:06 break_happy Views(82) Comments(0) Diggs(0) Edit
官方文档: https://developer.mozilla.org/zh-CN/docs/Web/API/MediaSource Media Source Extensions :媒体源扩展 API(MSE) 提供了实现无插件且基于 Web 的流媒体的功能。使用 MSE,媒体串流能够通过 Jav Read More
posted @ 2021-08-03 15:30 break_happy Views(642) Comments(0) Diggs(0) Edit
官方文档 webrtc :https://developer.mozilla.org/zh-CN/docs/Web/API/RTCPeerConnection 流式渲染最经典的场景是来自于steam 游戏, 可以通过云服务做gpu的计算,最后将视频流到客户端上(看上去很黑科技,其实不好用...)。 Read More
posted @ 2021-08-02 12:50 break_happy Views(1747) Comments(0) Diggs(0) Edit
定义: Service worke 是一个浏览器提供的独立线程,独立于当前网页的进程,在js主线程注册完之后,,开发者可以用编程的方式自己控制关联的页面,拦截并修改访问和资源请求,不局限于图片,甚至是ajax请求等,细粒度地缓存资源 特点 独立的一个线程(不影响页面UI渲染) 独立 生命周期 独立的 Read More
posted @ 2021-08-02 08:53 break_happy Views(303) Comments(0) Diggs(0) Edit
HTTP 协议在设计上就是一个单向的网络协议,服务器只能被动的接收请求,然后返回相应的数据。对于需要双向通信的场景,虽然可以通过轮询,Comet 等方式实现,但每次链接都要三次握手,效率低下。 与http比较: 1.都基于 TCP 的、应用层的可靠性传输协议 2.WebSocket 在握手时的数据是 Read More
posted @ 2021-08-02 07:26 break_happy Views(240) Comments(0) Diggs(0) Edit
Puppeteer puppeteer是一个node库,提供了一组用来操纵Chrome的API(默认headless也就是无UI的chrome,也可以配置为有UI) 有点类似于PhantomJS,但Puppeteer是Chrome官方团队进行维护的,前景更好。 使用Puppeteer,相当于同时具有 Read More
posted @ 2021-08-02 07:02 break_happy Views(581) Comments(0) Diggs(0) Edit
合图引擎基于json数据 解析,比较与htmltocanvas 先生成html再生成canva的解决方案, 渲染过程更可控,定制化成都高。 import Dev from '@ali/hetuCanva/dist/dev'; const data = { "name": "draw edit act Read More
posted @ 2021-08-01 14:56 break_happy Views(131) Comments(0) Diggs(0) Edit
最近性能优化, 随着各种对js优化的技术升级(小程序,weex)。 最后影响首屏渲染交互的还是图片的加载问题。 特别是活动这样强调首屏交互的重点场景,css绘图的效果性能角度没有办法被替代,问题是成本是调试变更代价大。 练习下css 的绘图能力 1.普通径向渐变 旋转效果。 思路: 简单的径向渐变 Read More
posted @ 2020-10-16 13:44 break_happy Views(247) Comments(0) Diggs(0) Edit