- 博客(267)
- 收藏
- 关注
RSS订阅原创 Nodejs APM监控实战分享
如何对线上的 nodejs 做监控，了解相关的 GC、内存使用情况、性能，如何更好的了解相关的指标，我们需要做一个采集线上数据的方案，但是又不希望侵入性太强 ，首先收集的指标。内存相关指标说明堆内存rss：常驻内存，node 进程分配的总内存大小external：v8 管理的 C++所占用的内存大小arrayBuffers：分配给 ArrayBuffer 的内存大小heapTota...
2023-12-06 17:20:00
130
原创 JS 堆栈&内存快照& tracre跟踪
V8 中抛出的所有内部错误在创建时都会捕获堆栈跟踪。可以通过非标准error.stack属性从 JavaScript 访问此堆栈跟踪。V8 还具有各种钩子，用于控制堆栈跟踪的收集和格式化方式，以及允许自定义错误也收集堆栈跟踪。本文档概述了 V8 的 JavaScript 堆栈跟踪 API。
2023-10-12 17:44:39
218
1
原创 文本标注技术方案（NLP标注工具）
Doccanodoccano 是一个面向人类的开源文本注释工具。它为文本分类、序列标记和序列到序列任务提供注释功能。您可以创建用于情感分析、命名实体识别、文本摘要等的标记数据。只需创建一个项目，上传数据，然后开始注释。您可以在数小时内构建数据集。支持命名实体识别，情感分类，机器翻译任务，界面比较友好。当前公司私有化部署的地址：(当前挂掉了,后端处理中)git：https://git...
2023-08-29 17:45:00
1090
2
原创 面试题：HTTP Code码及应用场景分析
1xx 消息(临时响应)属于临时相应，代表所发出的请求已经被接受，需要继续进行处理。只包含状态行和某些可选的响应头信息，并以空行结束。由于 HTTP/1.0 协议中没有定义任何 1xx 状态码，所以除非在某些试验条件下，服务器禁止向此类客户端发送 1xx 响应。1、“100 Continue”(继续)：–>表示临时响应并需要请求者继续执行操作的状态代码。应用场景：客户端应当继续发...
2023-08-05 21:07:00
1834
原创 前端面试经典算法题
前言现在面试流行考核算法，做过面试官，也被面试。问算法对面试官来说，是一种解脱，找出了一个看似很高明且能偷懒的办法选择人，避免了不知道问啥的尴尬；被面试者，也找到了一种新的面试八股文，刷就对了；算法题让面试与被面试找到了一种平衡。在实际的开发中，很多被考核的算法确实没啥卵用，面试者要认真琢磨考什么？下面是作者本人经历的一些面试题，有字节、腾讯、百度、滴滴的，仅供参考。字符串插值考察正则表...
2023-08-05 21:06:00
358
原创 高级 / 资深前端面试题集锦
以下是一线互联网公司高级前端面试题总结，包括百度、腾讯、网易、字节、知乎、京东、滴滴，小米，感兴趣的欢迎留言交流。1、请简述Js Bridge2、请说一下SSR的单机QPS3、请说一下eggJs的初始化原理4、前端错误如何捕获，promise的错误是如何捕获的5、vue的dom diff算法6、vue的ChildNode diff算法7、HTTP的400、401、403的区别8、...
2023-08-05 21:06:00
415
原创 前端面试经典手写题
1、手写Promiseclass Promise2 { state = "pending"; callbacks = []; constructor(fn) { fn(this.resolve.bind(this), this.reject.bind(this)); } resolve(result) { if (this.state !== "pendin...
2023-08-05 21:04:00
419
原创 node 实现 rpc
// index.jsconst diplomat = require('js-diplomat');const grpc = require('@grpc/grpc-js');const { randomUUID } = require('crypto');const { cupAdmin } = require('../proto');let discoverServer =...
2023-04-22 21:08:00
28
原创 antd 样式隔离实现
前端项目的组件库都使用的是 And Design，当一个系统作为另一个系统的子应用时，antd 样式嵌套会出现莫名的样式问题，以及一些在 global 中声明的 antd 样式，会全局污染。基于这种现状，我们需要一个方式将系统之间的 antd 样式进行隔离。好了，我们看下如何实现，以及实现后带来的一些并发问题如何解决吧。前置知识点首先为了统一管理和维护，首先我们将要修改的 antdp...
2023-03-16 14:06:00
1147
原创 pnpm + turbo 实践 monorepo
1、创建项目npx create-turbo@latest2、turbo.json 配置文件"dependsOn": ["^build"], // packges 目录下包的执行命令，用于处理依赖问题，依赖项执行的命令"outputs": ["dist/**", ".next/**"] // Turborepo将缓存默认输出到 dist/** 和build/**文件夹中。可以通过o...
2023-03-06 15:33:00
1008
原创 前端用户行为记录 rrweb
rrweb 是 'record and replay the web' 的简写，旨在利用现代浏览器所提供的强大 API 录制并回放任意 web 界面中的用户操作。rrweb 官网：Open source web session replay libraryrrweb 主要由 3 部分组成：rrweb-snapshot，包含 snapshot 和 rebuild 两个功能。snapsho...
2023-03-04 11:59:00
439
原创 node redis 在服务端使用踩坑
测试环境正常，生产环境不能正常访问1、测试环境和生产环境不同的是配置的 redis 不一样，难道是因为 redis吗？类似issue：https://github.com/luin/ioredis/issues?q=++Error%3A+read+ECONNRESEThttps://github.com/luin/ioredis/issues/12032、debug mock 代码...
2023-03-01 18:17:00
140
原创 Mock 平台建设方案
名称是否支持私有化部署是否开源备注https://www.apifox.cn/收费否https://easydoc.net/收费否https://github.com/easy-mock/easy-mock支持是推荐http://yapi.smart-xwork.cn/支持是推荐https://www.eolink...
2023-02-19 22:34:00
210
原创 sql 审核平台方案
开源 SQL 审核平台1、Archery:https://github.com/hhyo/Archery2、See：https://github.com/myide/see3、爱可生开源：https://opensource.actionsky.com/sqle/(爱可生开源方案)4、yearning前端：https://github.com/cookieY/gemini-nex...
2023-02-15 16:58:00
400
原创 React.cloneElement
React.cloneElement()接收三个参数第一个参数接收一个ReactElement，可以是真实的dom结构也可以是自定义的。第二个参数返回旧元素的props、key、ref。可以添加新的props，第三个是props.children，不指定默认展示我们调用时添加的子元素。如果指定会覆盖我们调用克隆组件时里面包含的元素。需求是开发一个组件支持传入 children，并可以展示...
2023-02-13 23:42:00
992
原创 OpenAI command-line client 安装
1、升级python3 pippython >=3.8.0brew install python3vi ~/.zshrcalias pip="/usr/local/bin/pip3"alias python="/usr/local/bin/python3"python -V // Python 3.9.7reset 配置全局的环境变量 exportOPENAI_...
2023-02-11 15:29:00
621
原创 关于 NodeJs 处理超长字符串问题的分析
问题：对于超大的 string V8不能支持问题背景在 Nodejs 计算服务中，对端上上报的内存信息二进制数据进行预处理+缓存时，遇到了一个奇怪的报错：RangeError: Invalid string length 。根据该报错信息，查找得知是字符串长度超过了 node.js 的限制，即 2^29-1 (约 5 亿+)个字符。整体流程如图所示。关于 node.js string 的长度...
2023-02-09 22:39:00
434
原创 antd/Form在setFieldsValue 后偶现在 getFieldsValue 的时候数据丢失
问题setFieldsValue 偶现在 getFieldsValue 的时候数据丢失。分析1、目前的问题是在渲染的过程中 getFiledValue 被改变了，那么谁会改变这个值呢？数据中有个 appeal_type 的 FiledValue 丢失了问题可能是 setFieldsValue 需要 dom 本身存在2、查一下 setFieldsValue 的实现机制ht...
2023-02-09 22:37:00
578
原创 react 的useMemo 与 useCallabck 的区别
React 的函数组件是非常好用的东西，相比 class 写法以及 Vue 的对象挂载写法简洁很多，代码测试复用成本低，容易入手，但也带来一些问题，无状态函数很理想，但现实有一些计算开销大、组件渲染频繁的场景是需要状态的，每次都计算一遍状态（callback 和 二次计算值）无疑很浪费内存，函数不像对象（React class 写法或者 Vue 组件写法）可以直接将状态挂载在自身，没有浪费内存的问题，要实现类似的效果只能找一个的内存挂载点挂载这些东东，所以有了 useCallback 和 useMemo
2022-12-19 12:03:38
373
原创 elentment-ui脚手架解析
序言现在前端的技术越来越杂,也越来越细了,以至于每次看完文档都会有个错觉,就是自己差不多会了.真正去做项目的时候又是重复之前的步骤.之前写Java的时候，会习惯性的看看源码，看完之后会对知识掌握的更牢靠，并且茅塞顿开的感觉简直妙不可言。再回想做前端的这段时间，确实时是自己浮躁了。我挑选了element做为学习目标的目的有二：1.element是一款Vue的UI框架,它可以将我的CSS...
2022-11-07 16:14:24
362
原创 webpack5 源码不得不提的 Tapable
我们可以源码查看下 Tapable 导出的 hooks，包含了以下几种。我们可以将 Tapable 的 hooks 分为同步和异步，我们也可以按其他的类别分类。
2022-11-04 08:21:56
155
原创 webpack5的打包原理分析
webpack打包工具是什么模块化开发的产物，模块化打包工具。require anything，bundle anything解决了什么问题，满足了什么需求热更新代理服务ES6翻译压缩打包自动上传模块开发的模块管理模块化开发全局变量模块依赖与执行顺序翻译代码输入是什么、输出是什么输入Javascript模块以及浏览器不能直接运行的其他拓展语言（TS、Less、Scss）输出输出浏览器可运行的代码，Webpack打包出来的bundle文件是一个IIFE的执行函数。首先是一
2021-08-20 16:37:20
376
原创 vue3实战-业务组件开发总结
概述vue3提供了compostion api，一方面给JS开发提供了更多的灵活性，另一方面对开发出稳定性高，扩展性好，易阅读维护成本低的代码提出了新的挑战，在使用vue3的过程中，我们应该如何开发自己的业务组件，读完本篇文章你将会获得答案。分析过程如果把逻辑都放到vue模版中，setup函数将会非常臃肿，因此，首先要对自己的业务组件逻辑部分进行拆分（模板部分拆分不在本次讨论范围），以音频文件上传功能为例。文件上传分为：1、选择文件2、对文件进行试听、增加、删除3、上传文件、上传进度、上传状
2021-06-21 18:33:47
624
原创 使用IntersectionObserver进行曝光打点
网页开发时，常常需要了解某个元素是否进入了"视口"(viewport)，即用户能不能看到它。IntersectionObserver是浏览器原生提供的构造函数：import'intersection-observer';export default { async mounted() { await this.$nextTick() var io ...
2021-05-17 16:59:00
306
原创 vue3.x源码学习 Ref 学习笔记1
refref最重要的作用，其实是提供了一套Ref类型，什么是ref类型呢？ref类型export interface Ref<T = any> { value: T /** * Type differentiator only. * We need this to be in public d.ts but don't want it to show up ...
2021-02-27 19:01:00
280
原创 依赖倒置原则
依赖倒置原则的定义依赖倒置原则(Dependence Inversion Principle，DIP)是 Object Mentor 公司总裁罗伯特·马丁(Robert C.Martin)于 1996 年在C++Report 上发表的文章。依赖倒置原则的原始定义为：高层模块不应该依赖低层模块，两者都应该依赖其抽象；抽象不应该依赖细节，细节应该依赖抽象(High level modules ...
2021-02-14 18:16:00
65
原创 /usr/lib64/libstdc++.so.6: version `GLIBCXX_3.4.15' not found的解决办法
原因缺少GLIBCXX_3.4.15版本，或是更高的版本。场景描述在CentOS 6.6 64bit上我将gcc从4.4.7版本升级到4.8.3以便让其支持c++11标准，然后我安装node-sass时出现了这个错误解决过程使用strings命令来查看报错的动态库/usr/lib64/libstdc++.so.6中是否含有GLIBCXX_3.4.15？strings /usr/lib64/l...
2020-02-19 17:48:00
577
原创 如何运行一个vue文件进行预览
如何预览一个.vue文件进行预览呢？每天写个页面，都要配置脚手架，能不能像以前开发前端页面一样，写一个index.html,然后编写js，css，就可以在浏览器上运行了呢？可是我又不想舍弃vue，那么能不能全局搭建一个脚手架，供我来使用呢？今天翻阅文档，发现了官方文档给出了一个方案安装npm install -g @vue/cli @vue/cli-service-global# o...
2020-01-31 19:25:00
2259
1
原创 如何写webpack loader帮助你升职加薪
简单来说loader是让其他类型的文件转换成webpack能理解的js代码的一段代码(函数)Out of the box, webpack only understands JavaScript files. Loaders allow webpack to process other types of files and converting them into valid modules ...
2020-01-07 15:04:00
48
原创 如何写一个webpack plugin，帮你升职加薪
我们经常使用到webpack的插件功能,那如何开发一个自定义的插件呢?首先创建插件比创建 loader 更加高级,webpack插件由以下组成：一个 JavaScript 命名函数。在插件函数的 prototype 上定义一个apply方法。指定一个绑定到 webpack 自身的事件钩子。处理 webpack 内部实例的特定数据。功能完成后调用 webpack 提供的回调。...
2020-01-07 15:01:00
57
原创 关于babe-loader^8.0.6的配置问题
1、报错报regeneratorRuntime is not defined 错误.babelrc配置{ // https://babeljs.io/docs/en/babel-plugin-transform-runtime#options "plugins": [ "@babel/plugin-transform-runtime" ], ...
2020-01-03 16:47:00
112
原创 前端使用blob展示二进制的图片
//DOMvar img = document.getElementById('img')//Ajaxvar xhr = new XMLHttpRequest()// 设置返回类型为blobxhr.responseType = "blob";xhr.addEventListener('load',() => {console.log(xhr.response);var b...
2019-12-31 17:31:00
1072
原创 前端的截图功能
依赖:html2canvasfunction dataURLtoFile(dataurl, filename) { var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[1]), n = bs...
2019-12-30 11:44:00
104
原创 npm安装报错：Error: EACCES: permission denied
报错如下：sudo npm i webpack -g/Users/xesfe/.npm-global/bin/webpack -> /Users/xesfe/.npm-global/lib/node_modules/webpack/bin/webpack.js# System-wide .profile for sh(1)> fsevents@1.2.11 install...
2019-12-22 19:58:00
465
原创 WEBRTC三种类型（Mesh、MCU 和 SFU）的多方通信架构
WebRTC 本身提供的是 1 对 1 的通信模型，在 STUN/TURN 的辅助下，如果能实现 NAT 穿越，那么两个浏览器是可以直接进行媒体数据交换的；如果不能实现 NAT 穿越，那么只能通过 TURN 服务器进行数据转发的方式实现通信。目前来看，Google 开源的用于学习和研究的项目基本都是基于 STUN/TURN 的 1 对 1 通信。如果你想要通过 WebRTC 实现多对多通信，该...
2019-12-21 13:17:00
123
原创 Workbox使用策略
1、什么是Workbox Strategies？当service workers 首次被引入时，可以设定一组常见的缓存策略。 缓存策略是一种模式，用于确定service workers 在收到fetch事件后如何生成响应。workbox-strategies提供了最常用的缓存策略，因此很容易将它们应用到服务工作者中。我们不会在Workbox支持的策略之外详细介绍，但你可以在Offline...
2019-12-19 18:52:00
429
原创 前端性能指标计算方法
performace的兼容写法 var t = new Object();var performance = window.performance || window.msPerformance || window.webkitPerformance;var resource = performance.getEntriesByType('resource') if ...
2019-12-19 12:00:00
226
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人