- 博客(404)
- 资源 (7)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 [浅析] vue3.0中的自定义渲染器
Vue3.0中支持 自定义渲染器 (Renderer)：这个 API 可以用来自定义渲染逻辑。它可以将 Virtual DOM 渲染为 Web 平台的真实 DOM。（在以往像weex和mpvue，需要通过fork源码的方式进行扩展）。1.自定义渲染器的原理渲染器是围绕 Virtual DOM 而存在的，在 Web 平台下它能够把 Virtual DOM 渲染为浏览器中的真实 DOM 对象，通过前面几章的讲解，相信你已经能够认识到渲染器的实现原理，为了能够将 Virtual DOM 渲染为真实 DOM，渲
2020-10-19 23:58:19
2324
原创 PixiJS核心概念及简单上手
PixiJS核心概念及简单上手0. PixiJS 介绍PixiJS是一个轻量级的2D渲染引擎，它能自动侦测使用WebGL还是Canvas来创建图形。开发者无需专门学习 WebGL 就能感受到强大的硬件加速的力量。PixiJS 会帮助你用 JavaScript 或者其他 HTML5 技术来显示媒体，创建动画或管理交互式图像（精灵），从而制作一个游戏或应用。它拥有语义化简洁的 API 接口。比如支持纹理贴图集和为精灵提供了一些简单的动画系统。它也提供了一个完备的场景图，你可以在精灵图层里面创建另一个精灵
2020-10-19 23:55:37
7897
2
原创 babel@7.x核心概念
babel核心概念babel已经推出7.x版本，与babel紧密关联的core-js也推出了3.x版本，与babel7.x和core-js3.x对应的是babel6.x和core-js2.x。babel7.x和core-js3.x有很多新变化，值得学习，并且目前业务中的很多还使用的是babel6.x，考虑在现有项目中对babel6.x进行升级处理，或者新的项目，肯定直接上babel7.x新的配置了；从本篇开始，我将尝试从细节方面来总结最新版本babel(7.x)的作用及用法。经过这几天了解babel和c
2020-08-16 16:31:24
911
原创 从libuv源码学习线程池
本文为学习记录：原文可以参考：libuv基础篇和Libuv学习线程池不像网络IO，libuv没有特定平台的异步IO原语可以依赖，所以当前是在线程池中执行阻塞（同步）IO来实现异步的。根据libuv官网对其架构的介绍，我们可以知道它并不是单线程的，它有一个线程池，用来处理文件IO、DSN查询等操作。在介绍线程池之前，先通过POSIX Threads介绍一下线程的基本操作，如果您对libuv的...
2020-02-09 18:37:29
1003
原创 从libuv源码中学习二叉堆
阅读本文你需具备知识点二叉查找树2.准备纸和笔(自己动手画一画，这样方能真的理解)1.libuv中如何使用最小二叉堆？libuv将最小二叉堆的算法应用到了timer上，我们看一下timer的使用：uv_timer_t timer_handle;r = uv_timer_init(loop, &timer_handle);// 每10秒钟调用定时器回调一次r = uv...
2020-02-07 21:23:10
557
原创 浅谈序列化中的字节序操作
业务处理上，有时会直接对字节进行操作。例如:实现私有协议，对校验位进行检测，敏感数据加密基础概念首先，我们需要理解几个基础概念。一般来说，字节是我们可以用语言处理的最小对象，无论是C/C++还是Java都没有直接提供bit类型。1 byte = 8 bit，除去最左侧的符号位1byte可以描述的范围是：-128 ~ 127。但是在大多数的业务处理中，我们通常会采用无符号位，即用1by...
2020-01-19 00:54:29
802
原创 mini-webpack 源码浅析
minipack 源码简析其实“打包”对于前端来说再熟悉不过了，但是深入其中的原理，却不是人人都熟悉。由于webpack功能的强大和盛行，我们大部分都是所谓的“配置工程师”。借此，特地简单分析了一官方文档中提到的一个minipack项目的源码，以此深入了解下什么是打包？以及打包的原理是什么？文章写的比较平，是按照分析代码的顺序写的，细微有些总结，有错误或不妥之处，恳请指出。前置知识首先...
2020-01-08 23:54:03
672
原创 深入了解Nodejs模块机制
我们都知道Nodejs遵循的是CommonJS规范，当我们require('moduleA')时，模块是怎么通过名字或者路径获取到模块的呢？首先要聊一下模块引用、模块定义、模块标识三个概念。1 CommonJS规范1.1 模块引用模块上下文提供require()方法来引入外部模块，看似简单的require函数， 其实内部做了大量工作。示例代码如下：//test.js//引入一个模块到当前...
2019-12-25 00:59:56
611
原创 用spawn 来编写跨平台 Node.js命令
前言Node.js 是跨平台的，也就是说它能运行在 Windows、OSX 和 Linux 平台上。很多 Node.js 开发者都是在 OSX 上做开发的，然后再将代码部署到 Linux 服务器上。由于 OSX 和 Linux 都是基于 Unix 的，因此两者共性很多。Windows 也是 Node.js 官方支持的平台，只要你通过正确的方式写代码，就能在各个平台上毫无压力的跑起来。Node....
2019-12-17 00:12:04
1064
原创 koa-convert 源码解析
npm：https://www.npmjs.com/package/koa-convert我们在迁移一些koa2的服务的时候，或者做一些node-server框架升级的时候，为了兼容koa1中的一些yield写法，不得不将老的yield- generator函数转化为koa2的async/await函数来执行。中间有两个问题，需要解决：如何将generator函数转化为Promise函数；...
2019-12-12 00:23:53
436
原创 koa-router-tree 源码解析
npm包：https://www.npmjs.com/package/koa-tree-router1.基数树这次学习的是koa-router-tree中的路由，在学习源码一种我们看到了koa-router-tree的路由是它的特色。然而基础数据使用了基数树也提供了性能的保障。因为路由这部分比较独立而且逻辑相对复杂，所以需要单独学习。首先我们需要了解的是基数树，百度百科中的解释其中有一个图可...
2019-12-07 21:54:05
669
原创 koa-router源码解析
大众点评的node框架Node-Server最大的特色是面向企业级 Web 全栈应用框架， 以Koa2为基础， 集成了架构中间件Pigeon、 Lion、 Cat、 Mapi、 Rhino等Node客户端，支持了Node Thrift。最大程度上帮助应用在 Web 开发中提升可维护性和扩展性。其中router路由的解析主要是依赖于koa-router, 依赖于koa-router的router()...
2019-11-26 00:07:10
422
原创 lerna+yarn workspace+monorepo项目的最佳实践
1.monorepo管理对于维护过多个package(功能相近)的同学来说，都会遇到一个选择题，这些package是放在一个仓库里维护还是放在多个仓库里单独维护。Multirepo 是比较传统的做法，即每一个 package 都单独用一个仓库来进行管理。Monorepo 是管理项目代码的一个方式，指在一个项目仓库 (repo) 中管理多个模块/包 (package)，不同于常见的每个模块建一个 ...
2019-08-18 10:59:24
12458
6
原创 【Promise 】必知必会经典题
题目转载来自：https://github.com/nswbmw/node-in-debugging/blob/master/3.1 Promise.md如何写出清晰优雅的代码也是调试重要的一部分，而在过去很长一段时间内，JavaScript 最令人吐槽的就是回调地狱（callback hell）了。先看一段代码：现在，我们以十道题巩固一下前面所学到的 Promise 的知识点。题目一: P...
2019-07-07 10:28:13
778
原创 TypeScript学习之 -- 高级类型
交叉类型交叉类型是将多个类型合并为一个类型。 这让我们可以把现有的多种类型叠加到一起成为一种类型，它包含了所需的所有类型的特性。 例如，Person & Loggable 同时是 Person 和 Loggable。 就是说这个类型的对象同时拥有了这两种类型的成员。我们大多是在混入（mixins）或其它不适合典型面向对象模型的地方看到交叉类型的使用。 （在 JavaScript 里发生...
2019-06-25 00:08:49
448
原创 Node调试指南-内存篇
主要摘自: - Node.js 调试指南 Node 案发现场揭秘Node.js 发展到今天，已经被越来越广泛地应用到 BFF 前后端分离 、 全栈开发 、 客户端工具 等领域。然而，相对于应用层的蓬勃发展，其 Runtime 对于绝大部分前端出身的开发者来说，处于黑盒的状态，这一点并没有得到很好的改善，从而也阻碍了 Node.js 在业务中的应用和推广。内存泄漏问题对于缓慢上涨最终 OO...
2019-02-19 23:43:50
2251
原创 Node.js调试指南
现今 Node.js 愈发受欢迎，应用场景也越来越多，学会高效调试 Node.js 会让日常开发更高效。下面讲下使用inspector调试nodejs程序Node6.3+ 的版本提供了两个用于调试的协议：v8 Debugger Protocol 和 v8 Inspector Protocol 可以使用第三方的 Client/IDE 等监测和介入 Node(v8) 运行过程，进行调试。v8 In...
2019-02-19 23:42:21
1818
转载 React Native之React速学教程
本文出自《React Native学习笔记》系列文章。React Native是基于React的，在开发React Native过程中少不了的需要用到React方面的知识。虽然官方也有相应的Document，但篇幅比较多，学起来比较枯燥。通过《React Native之React速学教程》你可以对React有更系统和更深入的认识。为了方便大家学习，我将《React Native之React速学...
2019-01-08 00:34:50
1828
转载 React Native布局详细指南
本文出自《React Native学习笔记》系列文章。一款好的APP离不了一个漂亮的布局，本文章将向大家分享React Native中的布局方式FlexBox。在React Native中布局采用的是FleBox(弹性框)进行布局。FlexBox提供了在不同尺寸设备上都能保持一致的布局方式。FlexBox是CSS3弹性框布局规范，目前还处于最终征求意见稿 (Last Call Working...
2019-01-07 23:35:38
1327
转载 React Native调试技巧与心得
本文出自《React Native学习笔记》系列文章。在做React Native开发时，少不了的需要对React Native程序进行调试。调试程序是每一位开发者的基本功，高效的调试不仅能提高开发效率，也能降低Bug率。本文将向大家分享React Native程序调试的一些技巧和心得。Developer MenuDeveloper Menu是React Native给开发者定制的一个开发者...
2019-01-07 01:09:54
2186
原创 JavaScript设计模式与实践--适配器模式
适配器模式（Adapter） 适配器模式主要用来解决两个已有接口之间不匹配的问题，它不考虑这些接口是怎样实现的，也不考虑它们将来可能会如何演化。适配器模式不需要改变已有的接口，就能够使它们协同作用。适配器的别名是包装器（wrapper），这是一个相对简单的模式。在程序开发中有许多这样的场景：当我们试图调用模块或者对象的某个接口时，却发现这个接口的格式并不符合目前的需求。这时候有两种解...
2018-08-05 16:44:25
1172
原创 深入分析Node.js事件循环与消息队列
多数的网站不需要大量计算，程序花费的时间主要集中在磁盘 I/O 和网络 I/O 上面SSD读取很快，但和CPU处理指令的速度比起来也不在一个数量级上，而且网络上一个数据包来回的时间更慢：一个数据包来回的延迟平均320ms(我网速慢，ping国内网站会更快)，这段时间内一个普通 cpu 执行几千万个周期应该没问题因此异步IO就要发挥作用了，比如用多线程，如果用 Java 去读...
2018-08-03 00:05:44
9596
7
原创 微信小程序：一些运行细节及针对性的优化策略
原文链接：https://juejin.im/post/5b496d5d5188251a90187635为什么要做性能优化？一切性能优化都是为了体验优化1. 使用小程序时，是否会经常遇到如下问题？打开是一直白屏打开是loading态，转好几圈我的页面点了怎么跳转这么慢？我的列表怎么越滑越卡？2. 我们优化的方向有哪些？启动加载性能渲染性能3....
2018-07-14 12:09:06
15148
6
转载 JavaScript设计模式 Item10 -- 策略模式Strategy
理解javascript中的策略模式策略模式的定义是：定义一系列的算法，把它们一个个封装起来，并且使它们可以相互替换。使用策略模式的优点如下：优点： 1. 策略模式利用组合，委托等技术和思想，有效的避免很多if条件语句。 2. 策略模式提供了开放-封闭原则，使代码更容易理解和扩展。 3. 策略模式中的代码可以复用。一：使用策略模式计算奖金；下...
2018-05-06 15:51:48
387
转载 预加载 Skeleton Screen — 骨架屏
用户体验一直是前端开发需要考虑的重要部分，在数据请求时常见到锁屏的loading动画，而现在越来越多的产品倾向于使用Skeleton Screen Loading(骨架屏)替代，以优化用户体验。Skeleton ScreenSkeleton Screen(骨架屏)就是在页面数据尚未加载前先给用户展示出页面的大致结构，直到请求数据返回后再渲染页面，补充进需要显示的数据内容。常用于文章列表、动态列表页
2018-03-17 12:14:10
8106
原创 lerna -- 多包管理工具
什么是 lerna ?Lerna 它是基于 Monorepo 理念在工具端的实现。lerna 出现的历史背景Lerna 出现的历史背景，其实就是 Monorepos 和 Multirepos 在进行项目管理时优与劣。说说我个人的感触：Multirepos缺点：在 Multirepos 方案中我们通常一个项目会有一个 repo 或者说是一个 module 一个 rep...
2018-02-11 23:33:17
5303
原创 Redis事件与事务
一、Redis特点特性：速度快、基于键值对的数据结构服务器、功能丰富、简单稳定、客户端语言多、持久化、主从复制、支持高可用和分布式单线程架构：redis使用单线程架构和I/O多路复用模型来实现高性能的内存数据库服务。一条命令从客户端到服务端不会立刻被执行，所有命令都会进入一个队列中，然后逐个被执行。（执行顺序不确定的）。单线程如何满足线上运行速度？ 纯内存访问：所有数据放在内存中，响应时长大约10
2018-01-14 19:32:30
767
转载 【Deep Linking】：从浏览器调起 APP
Deep Linking 只是一个概念， 是指通过一个链接进入另一个网站/App，并直接浏览其内部的某个页面。 Deep Linking 给用户带来的是非常顺滑的浏览体验，尤其在 Web 世界中 Deep Linking 的实现非常容易。但如果要进入 App 并定位到对应的页面则较为困难，URI Scheme, Universal Links, Android App Links, 以及 Chro
2017-12-31 01:09:23
2055
转载 【PWA】web推送技术
伴随着今年 Google I/O 大会的召开，一个很火的概念–Progressive Web Apps 诞生了。这代表着我们 web 端有了和原生 APP 媲美的能力。但是，有一个很重要的痛点，web 一直不能使用消息推送，虽然，后面提出了 Notification API，但这需要网页持续打开，这对于常规 APP 实现的推送，根本就不是一个量级的。所以，开发者一直在呼吁能不能退出一款能够在网页关
2017-12-25 00:25:03
6003
转载 【PWA】Service Worker 全面进阶
Service Worder 是用来代替 manifest，用来生成缓存的效果的。以前吭哧吭哧的学 manifest 的时候，就发现 MD 好难用。而且 MDN 特意告诉你，manifest 有毒，请不要乱用，保不定后面不支持。今儿，我看了下兼容性，呵呵~人生苦短，及时享乐，前端真坑，不敢乱学。前方高能，如果觉得生活没有趣味可以继续看下去，会让你的人生更没有趣味。如果觉得凑合能过，请 ctrl/c
2017-12-24 16:28:51
4394
1
转载 【PWA】Manifest
manifest 文件我们以前在做富应用缓存时用到过，那时候的用法是用来缓存网页上的一些资源。即：html manifest="demo.appcache">...html>使用这种方式来进行离线缓存。我们参考一下里面的具体内容：CACHE MANIFEST# 2012-02-21 v1.0.0/theme.css/logo.gif/main.jsNETWORK:login.
2017-12-24 00:06:34
1131
转载 【PWA】响应式开发
PWA 是专门应对手机开发而提出的概念，不过，由于手机端在国内四分五裂的局面看来（还包括 PC/Pad），屏幕尺寸的不同，网页设计的样式和大小当然也是完全不一样的。为了让 Web 能完美的在多端上运行，这里，我们就需要进行响应式开发。响应式的目的就是让一个网站尽可能的适配所有大小的网页。当然，响应式开发所用到的技术也是非常之多，不过，主要的还是 CSS 。meta 标签meta 标签之所以重要，是
2017-12-23 22:13:01
682
转载 【PWA】简介
首先，PWA 是啥？ PWA 全称是: Progressive Web Apps。这是 2016 年，Google I/O 大会上提出一个 Next Web Generation 的概念。这并不是描述一个技术，而是一些技术的合集。PWA 是专门应对手机 Web 开发而提出的，通过新技术的成熟，实现最好的 Web + 手机 APP。也就是说，能让你在使用 Web 的时候感觉像是在使用 APP。如果是
2017-12-23 21:54:59
901
转载 【微信小程序】自定义组件
手把手教你实现微信小程序中的自定义组件微信小程序中的组件前言之前做小程序开发的时候，对于开发来说比较头疼的莫过于自定义组件了，当时官方对这方面的文档也只是寥寥几句，一笔带过而已，所以写起来真的是非常非常痛苦！！好在微信小程序的库从 1.6.3 开始，官方对于自定义组件这一块有了比较大的变动，首先比较明显的感觉就是文档比以前全多了，有木有！（小程序文档），现在小程序支持简洁的组件化编程，可以将页面内
2017-12-17 20:52:24
15100
2
转载 小程序中吸底按钮适配 iPhone X 方案
小程序中吸底按钮适配 iPhone X 方案随着第二三批iPhone X的陆续到货，身边的土豪们纷纷用了起来，因为iPhone X的齐刘海导致的适配问题很多，所以这群土豪更沉浸在各种找bug中，不出所料，豌豆公主小程序在一些地方也出现了一丢丢体验不好的地方，主要是商品详情页和购物车的吸底按钮栏，会与Home Indicator横条重叠，这样在点击下方按钮时很容易误触发手势操作，如下图：是bug就得
2017-12-12 00:19:57
1166
原创 【微信小程序】IOS/Android兼容坑
一、时间转换问题：这不只是小程序上面的问题是ios系统 都有这个问题 就是new Date(“2017-06-16”) 在IOS会出现NAN的情况所以对于时间转换需要另行封装，解决方案如下1.替换”-“为”/“2.删除”.“后面的字符串（带毫秒也会有问题）代码如下： /** * 字符串转换为时间 * @param {String} src 字符串 */ s
2017-12-02 16:12:46
2393
原创 【微信小程序】video视频组件问题
前言将babel捧作前端一个划时代的工具一定也不为过，它的出现让许多程序员幸福地用上了es6新语法。但你就这么放心地让babel跑在外网？反正我是不放心，我就曾经过被坑过，于是萌生了研究babel代码转换的想法。本文不是分析babel源码，仅仅是看看babel转换的最终产物。es6在babel中又称为es2015。由于es2015语法众多，本文仅挑选了较为常用的一些语法点，而且主要是分析babel-
2017-12-02 16:02:39
53141
6
转载 babel到底将代码转换成什么鸟样？
前言将babel捧作前端一个划时代的工具一定也不为过，它的出现让许多程序员幸福地用上了es6新语法。但你就这么放心地让babel跑在外网？反正我是不放心，我就曾经过被坑过，于是萌生了研究babel代码转换的想法。本文不是分析babel源码，仅仅是看看babel转换的最终产物。es6在babel中又称为es2015。由于es2015语法众多，本文仅挑选了较为常用的一些语法点，而且主要是分析babel
2017-09-17 22:01:09
3293
1
转载 jscpd--前端代码重复率检测
在实际开发中，一般的重复代码有一下几类完全一致的代码或者只修改了空格和评论结构上和句法上一致的代码，例如只是修改了变量名插入和删除了部分代码功能和逻辑上一致的代码，语义上的拷贝很明显越往后，重复代码检测难度越大。在实际情况中，我们的检测要求只要大致能满足前两者就已经足够了。在技术上，重复代码检测主要有以下分类：基于代码行的基于标识符（token）的基于度量（metrics）的基于抽
2017-09-05 23:28:17
9528
1
原创 MAC显示屏的网页图片兼容方案
背景图片不同分辨率下的兼容方案调研PC首页改版中遇到的mac下使用一倍图时，很模糊，一方面，MAC带来了高清屏幕的革命，另一方面，页存在严重的分辨率适配问题，但毕竟我们的用户大部分是在wins平台的机器上，我们为了在满足大部分用户的一般分辨率的同时，一些MAC用户的所要拥有的极致体验，也不容忽视，在网上查阅了一些资料，发现还是由一些解决方案：网页上的图片一般是两种，一种为背景图，一种是image标签
2017-09-01 02:02:24
1316
cvx_usrguide
2014-04-26
0_1线性规划模型的MATLAB实现及应用
2014-04-26
数学建模论文1992-2011年全部优秀论文与点评
2012-08-21
如何将开发API文档整合到一起？如下图所示？
2015-12-14
TA创建的收藏夹 TA关注的收藏夹
TA关注的人