- 博客(183)
- 资源 (7)
- 问答 (1)
- 收藏
- 关注
RSS订阅
原创 Javascript 内存（二）：垃圾回收机制
一、前言当内存不再占用，此时需要内存管理对不使用的内存区域进行清空操作，这就是所谓的垃圾回收机制。高级语言解释器内嵌了垃圾回收器，主要是跟踪内存的分配和使用状况，以便当分配的内存不再使用时，自动释放。二、垃圾回收策略在内存管理中，垃圾回收策略常用的有引用计数清除和标记-清除。1、引用计数清除引用： 在内存管理的环境中，如果一个对象可以有能力访问另一个对象的属性方法，这就叫做这个对象引用另一个对象。（此处对象不仅仅指Object对象，还可表示函数作用域）引用计数清除： 如果一个对象
2020-11-27 11:02:48
205
原创 engine.io 原理详解
engine.io 原理详解最近，业务中有使用到 socket.io，进行客户端与服务端的实时通信。socket.io提供的API易上手，对新手友好，这就极大提高了开发者的效率。不过，期间也有遇到很多socket.io中的坑，例如，中文乱码问题，服务端NPE问题 等。有些涉及到底层的问题，就势必要理解socket.io设计原理，进行排查。所以，总结了一下相关的概念，方便今后更快定位问题。s...
2019-01-26 22:04:03
6279
原创 模板引擎：二、实现一个Json解析器
2.Js实现Json解析器前言 本文主要对Json解析器的实现进行探讨。 如果想深入了解其原理，可以参考上一篇文章：模板引擎：一、理解Json解析器工作原理项目github地址：https://github.com/yang657850144/parseJson案例说明例如：拿一段最简单的Json字符串举例(“{ “a”: 1 }”)，要将其解析为JSON对...
2018-07-21 23:29:39
1776
原创 模板引擎：一、理解Json解析器工作原理
Json解析器初衷编写Json解析器目的是为了拓展自己的知识广度，并且通过简单的手写实践，能够深入了解一些技术细节(AST、DFA&NFA、LL(1)文法)，以及便于理解目前主流的前端框架设计。 那么就通过Json，切入正题JsonJson一共定义了四种数据类型：数值类型、字符串类型、数组、对象。其中，前两者可以归纳为基本类型，后两个可以归纳为复合类型。 不过，...
2018-07-20 20:51:53
2403
原创 CSS3（三）Animation 入门详解
Animation前言 好的前端工程师，会更注重用户的体验和交互。那么动画就是将我们的静态页面，变成具有灵动性，为我们的界面添加个性的一种方式。下面是七喜的官方主页，它就是很好的富交互样例。鼠标移动到导航栏，就会播放多种动效，给用户一种酷炫的体验。我觉得用户体验，才是前端工程师更加关注的问题，而不是一味追求Javascript的编码技能。 七喜官方网站A...
2018-04-17 16:07:44
71972
9
原创 【nuxt3】cannot read preperties of null (reading ‘$nuxt‘)
vue3 中，通过 createVNode 创建子组件实例时，发现子组件无法获取到父组件中的 router、store 信息，一旦子组件使用就会报错。通过控制台断点调试，发现时 appContext 值为空导致的。怀疑是创建子组件的时候，没有将父组件中的上下文传递过去。,需要将父组件中的context，传递给子组件中。
2023-12-09 19:59:23
581
原创 使用 js 动态修改在线 svg 背景色
由于网上搜了很多相关资料，都是介绍如何通过 js 修改本地 svg 资源。不过我们要求是要修改在线 svg 资源，因此，在一顿研究之后，封装了如下组件。
2023-09-19 16:23:04
699
原创 flex 弹性盒子子元素宽度被压缩
flex-shrink 属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小，它还有另外一个值，就是0.
2022-06-14 14:34:00
2286
原创 CSS: 使用 svg 实现圆形进度条
使用 Vue 框架进行实现<template> <div class="mhy-audio-player" @click="onClickAudio"> <div class="mhy-audio-player__svg"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" w.
2022-05-19 18:53:58
470
2
原创 css 文本只显示两行，超出部分用省略号表示
代码块如下: overflow: hidden; overflow-wrap: break-word; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
2022-01-07 15:10:36
904
原创 git push github失败，提示：SSL_connect: SSL_ERROR_SYSCALL in connection to github.com:443
git push github失败，提示：SSL_connect: SSL_ERROR_SYSCALL in connection to github.com:443问题描述当在 VScode 中，执行 push 操作时，出现如下报错：$ git pushfatal: unable to access 'https://github.com/robbiemie/vue-sourcecode-analyze/': LibreSSL SSL_connect: SSL_ERROR_SYSCALL in c
2021-10-03 13:44:33
448
原创 Gerrit VS Gitlab
一、Gerrit 简介第一次入职的时候，看到 Gerrit 的我是一脸懵逼，这是个什么上古的玩意，界面交互这么丑…因为，在之前公司都是使用类似GitLab 这种版本控制平台，初次使用或多或少有些抵触，后面几天通过了解其工作流程，大概对它有了个基本的认识。引用 wiki 百科的介绍 Gerrit 和 GitLabGerrit，一种开放源代码的代码审查软件，使用网页界面。利用网页浏览器，同一个团队的软件开发者，可以相互审阅彼此修改后的代码，决定是否能够提交，回退或是继续修改。它使用版本控制系统Git作
2021-09-23 17:24:00
7898
1
原创 git merge branch 没有产生新的提交信息
1. 问题git merge branch 没有产生新的提交信息，而是直接将 dev branch 的提交信息直接迁移过去。如何才能 merge branch 的时候，产生一次新的提交呢？2. 原因为什么直接 merge 没有产生一次新的提交呢？如果我们的祖先分支以 master 为例，再 checkout 一个新的分支（bugfix）后，产生了新的提交，与此同时，其他的开发分支没有往 master 合并新的提交。这样，新的分支与 master 分支的最新提交历史是共同的祖先。此时，merge
2021-07-09 11:15:04
4510
原创 安卓手机：无法安装该证书 因为无法读取该证书文件
IOS：设置 —> 通用 —> 关于本机 —> 受信任证书存储区找到需要安装的证书，安装即可。ANDROID：设置 — 安全 — 从手机存储安装设置 — 其他设置 — 设备与隐私 — 从存储设备安装证书设置 — 更多设置 — 系统安全 — 从 SD 卡安装找到需要安装的证书，安装即可。...
2021-05-19 11:58:03
8729
4
原创 【解决方案】tar: Error opening archive: Unrecognized archive format
tar: Error opening archive: Unrecognized archive format这个报错原因是由于当前环境无法解析该文件导致。可能由于文件本身损坏导致报错。tar 指令使用将文件全部打包成tar包$ tar -cvf log.tar log2012.log解包$ tar -zxvf /opt/soft/test/log30.tar.gz log2013.log...
2021-03-02 11:13:27
27365
原创 【解决方案】VSCode remote ssh 连接远程机器，报错：remote host key has changed port forwarding is disabled
问题描述使用 remote-ssh 链接远程机器，发现控制台会报如下错误:$ ssh [email protected]@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED! @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
2021-01-26 14:38:28
10206
4
原创 【解决方案】git clone 报错: Peer‘s Certificate issuer is not recognized.
问题描述在linux 机器上，拉取远程git 仓库时，会报如下错误信息:Peer’s Certificate issuer is not recognized.[centos ~]$ git clone https://git.code.com/web/downloaderCloning into 'downloader'...fatal: unable to access 'https://git.code.com/web/downloader': Peer's Certificate is
2021-01-26 11:28:10
5312
原创 Docker 基础概念
DockerfileImage 文件，都是通过 Dockerfile 文件生成的。1.dockerfile 语法dockerfile文件格式:FROM node:8.4: COPY . /appWORKDIR /appRUN npm install --registry=https://registry.npm.taobao.orgEXPOSE 3000CMD node index.jsFROM: 表示引用的image名称以及版本号COPY: 第一个参数表示当前的文件路径，第二参数
2021-01-15 18:19:15
119
原创 Docker 架构设计
Docker vs 虚拟机Docker 和 虚拟机的区别 https://blog.fundebug.com/2017/05/31/docker-and-vm/Linux 操作系统内核层(Kernel Layer) 主要进程调度、文件系统、IO、内存管理用户层 主要与系统内核进行交互一般不同的linux版本，使用的是同一套内核代码，不同的是用户层的差异。Docker 特点容器环境配置，无需再关心操作系统层多个容器之间相互隔离，可以共享宿主环境轻量级，可以快速启动支持自动缩扩容，可以
2021-01-15 18:18:29
232
1
原创 【解决方案】TS2300: Duplicate identifier
问题描述在编译执行 ts文件时，出现这个问题:$ tsc -p tsconfig-build.jsonnode_modules/react-scripts/lib/react-app.d.ts:55:18 - error TS2300: Duplicate identifier 'src'.55 export default src; ~~~ src/custom.d.ts:3:18 3 export default content;
2020-12-17 21:31:08
4806
原创 Javascript 内存（三）：内存泄漏常见场景及分析
前言内存泄漏问题，对于 Web H5 开发者来说，因为每次刷新页面，浏览器就会将当前页面的内存进行释放，影响较小。但是，对于持续不间断执行的程序，比如Nodejs。如果存在内存泄漏问题，那么内存占用会随着时间影响越来越大，直至达到内存限制，进程崩溃。常见的内存泄漏场景内存泄漏问题，一般是因为 GC 导致未使用的内存，没有及时被释放造成的。而容易导致内存泄漏的也主要指堆内存。1、循环引用var div;window.onload = function () { div = documen
2020-12-01 17:56:50
1010
原创 Vysor 最新安装使用教程
前言Vysor 是一款 Chrome 应用，能够在 Chrome 里通过 USB 直接控制 Android 设备，无需 root。安装步骤官方网站1 桌面端环境配置1.1 进入官网，准备下载安装包 1.2 下载chorme 插件 注意 软件的类型不要选错，因为后面会针对Chorme版本进行破解。 1.3 在chorme应用商店下载 注意 需...
2020-11-30 16:11:05
45881
3
原创 Javascript 内存（一）：基础知识
一、前言Javascript 内存分配的时机是在创建变量阶段，会自动进行内存的分配。并且在不占用该变量的情况下，会自动释放该内存。这个释放的过程称为"辣鸡回收"。二、内存生命周期分配内存阶段使用内存阶段释放内存阶段1. 分配内存阶段该阶段是在创建变量的时候，会自动分配内存地址。// 创建字符串类型变量let obj = { a: "robbie memory"}2. 使用内存阶段该阶段是对创建的变量读写操作的时候进行。// 读操作-将 newObj 的内存地址指向 o
2020-11-26 20:16:45
198
原创 有限状态自动机的应用场景 (javascript)
有限状态自动机的应用场景状态机是有限状态自动机的简称。是用来描述事物有限个状态之间，相互切换的数学模型。state: 状态，一个状态机至少有两个状态event: 事件，执行某个操作的触发条件action: 动作，表示事件执行后，即将执行动作transtion: 变换，状态之间的相互切换思考: 抽奖组件，如何可以抽象成一个状态机。状态start (未抽奖时，正常滚动)ongoing_run_scroll (抽奖进行中，转盘快速滚动)ongoing_stop_scroll (抽
2020-11-21 16:03:15
1725
原创 Github 如何设置 master 为默认分支
起因github 新版本上线之后，原默认分支为 master,现在统一改为了 main 。我不禁产生疑问，为什么要改呢？原因大概是漂亮国农奴历史遗留问题导致的，master(奴隶主)/slaver(奴隶)。解决方法我们已经习惯以 master 作为默认分支了，那么如何才能设置会原来的状态呢？打开 github 官网，登录成功之后，进入设置页点击切换到 Repository， 将原有的 main 替换为 master , 点击 update 即可。...
2020-10-31 14:57:33
9825
7
原创 Nodejs 线程小结
一、基础线程// 以下操作会创建7个线程setInterval(()=>{ console.log('sleep')}, 5000)通过所谓的 node 单进程，是指Javascript的执行是单线程的，JS的宿主环境，无论是 node 还是浏览器都是多线程的。主线程：编译、执行代码编译/优化线程：在主线程执行时，优化代码分析器线程：记录分析代码运行时间，为优化代码提供依据其余是垃圾回收线程二、异步IO操作，额外占用4个线程node 中的一些 IO操作(DNS,FS
2020-10-09 16:36:04
648
原创 Serverless：一、基础知识
什么是 ServerlessServerless（即无服务器）计算是一种云计算执行模型，云厂商提供程序运行的服务器，并动态管理机器资源的分配。云厂商基于应用程序消耗的实际资源量进行定价，而不是用户预先购买的容量。在作者看来，Serverless 更像是一种服务架构的设计理念，业务侧只需要关心自己的业务,今后无需关心代码部署到具体哪台机器上，以怎样的形态运行，即弱化了后端和运维的职责。解决了什么痛点Serverless 最大的好处在于，帮助开发者解放了机器运维部署的成本。降低购买和维护服务器
2020-09-07 15:31:46
407
原创 【解决方案】使用sequelize连接mysql数据库出错
问题描述在使用 sequelize 连接 mysql 数据库时，会出现这个错误：SequelizeConnectionError: Client does not support authentication protocol requested by server; consider upgrading MySQL client大概的意思就是: MySQL 拒绝我们的连接请求，让我们尝试升级 MySQL 版本。升级版本这种操作，改动比较大，可能会影响线上数据服务。因此，采用了一个影响范围较小的方
2020-09-04 17:35:48
2047
原创 NodeJS 内存溢出排查分析: JavaScript heap out of memory
一、起因之前内网部分服务不稳定，请求偶尔会挂掉，需要频繁重启。本着实事求是的思想，决定排查并解决这个顽疾。二、日志分析通过登录机器查找日志发现具体的错误信息，“JavaScript heap out of memory”，可以看出是由于内存不足导致的服务异常。三、内存溢出分析1.分析通过执行top指令，发现该进程([TSW/worker/0]) CPU占有率和 memery 占比一直居高不下。可以发现一些问题:内存占用暴涨，大约600MCPU占用率极高猜测: 可能是 kube
2020-09-02 17:16:44
11676
原创 【解决方案】H5 页面滚动穿透 overflow:hidden 失效
在h5页面上，如果想要让页面禁止滚动。一般通过给 body 元素 overflow:hidden;进行设置。但是，在部分安卓机上，上述操作并不会生效。因此，我们通过 fixed 布局来解决这个问题。当我们想要禁止页面滚动时，设置下面的属性，即可生效:// 设置 fixed 布局document.body.style.position = 'fixed';document.body.style.height = '100%';document.body.style.width = '100%.
2020-08-17 18:33:54
1769
原创 定时备份数据库
前言由于业务原因，经常需要操作数据库。可能一个手抖，误操作将外网数据进行删除或者批量更新。这样的后果，无疑是惨痛的。本着居安思危的想法，本文将介绍通过定时任务，执行数据库的备份。以及备份优化的常用方法。一、Crond 定时任务Linux crontab是用来定期执行程序的命令。1.进入编辑窗口# 通过管理员权限启动# username: 默认使用 root 用户# 例如: sudo crontab -u root -e $ sudo crontab -u username -e 执行
2020-08-12 17:37:32
224
原创 React Navigation5.x 动态修改标题内容
React Navigation官方文档搭建环境# 安装全局依赖$ npm install -g expo-cli# 生成种子模板expo init <projectName> [--npm]安装 ReactNavigation# 安装依赖$ yarn add @react-navigation/native# 安装依赖$ yarn add react-nati...
2020-03-02 22:14:17
2362
原创 【解决方案】ESLINT 报错: Cannot read property 'range' of null
Cannot read property ‘range’ of null问题描述:Cannot read property ‘range’ of nullTypeError: Cannot read property ‘range’ of null解决方案:在项目根目录下，创建 .eslintrc.js 文件，添加如下规则:module.exports = { rules : {...
2020-02-21 13:39:56
11433
原创 Android Studio 3.x找不到Android Device Monitor
问题原因官方已经废弃官方声明: Android Device Monitor is a standalone tool that provides a UI for several Android app debugging and analysis tools.However, most components of the Android Device Monitor are depre...
2020-02-05 19:57:23
243
gulp-plugins
2018-03-08
gulp种子项目
2018-03-08
js如何实现登录第三方网站
2016-05-10
TA创建的收藏夹 TA关注的收藏夹
TA关注的人