- 博客(74)
- 收藏
- 关注
RSS订阅原创 WebAssembly学习记录
流程背景编译C/C++指定函数到wasm文件，为JavaScript提供计算密集型任务的高效解决方案。流程概述按照emscripten官方文档安装编译器并对C/C++打包。注：也可以编译整个C/C++文件到wasm，本流程只导出函数运行和激活编译器环境运行编译成wasm文件命令说明注：官网上提到过导出cwrap，ccall来给JavaScript调用导出的C/C++函数。但是安装最新版emscripten发现没用。指明导出的C/C++函数，函数名前需要加下划线-O指明编译优化方案，和g++中-O。
2024-04-25 23:18:46
978
原创 Webpack的Loader和Plugin
1.总类型前置loader普通loader内联loader后置loader2.默认类型默认为normal类型3.修改类型配置时可以通过enforce修改类型。Plugin在Webpack工作流程插入操作来扩展Webpack功能。
2024-04-10 20:21:12
2221
原创 组件库打UMD包
项目使用的是antd4.x，在组件库未单独打umd包前还需要引入样式文件，在打包时还配置了插件将antd依赖的momentjs转为体积较小的dayjs。最后的umd包的体积是960KB左右，我们的目标是1.2MB左右，说明仍然可以借助提取第三方包作为外部依赖来压缩umd包的体积。在上面几个问题的解决中已经把一些体积较大的包放入外部依赖，但是打包成umd后进行体积分析，发现体积很大，最后的umd包的体积是1.49MB左右。打包时在common组件库打包入口类似于antd的es包引入了所有组件并重新导出。
2024-03-15 17:33:33
2099
原创 Webpack学习记录
打包入口，从一个或多个入口打包打包文件输出位置webpack本身只能编译JavaScript处理模块化。编译CSS等其它资源需要借助loader。扩展webpack的功能。开发模式下运行项目并热更新。开发模式development和生产模式production。
2024-03-14 22:00:39
1281
原创 TypeScript类型注释
typescript使用类型注释来进行静态类型检查其中基本类型正常注释即可，选择大小写均可。对于引用类型需要特别注意。如果使用Object或object注释：（1）则会认为对象是空对象，不可以对其属性进行改查。（2）宽松地类型检查，声明obj时赋初始值，属性任何类型都是合理的（推荐使用）如果使用对象字面量进行注释：（1）则会认为对象是灵活的，可以对其属性进行改查。（2）正常的类型检查，obj赋值时，属性必须严格对照注释1.1.2 注释：Function注释Function分为箭头函数和普通函数
2023-06-02 19:46:30
2323
4
原创 弹性计算
W3C官网 https://www.w3.org/TR/2018/CR-css-flexbox-1-20181119/#flex-flex-grow-factor。在满足“收缩条件”时，flex容器中的项目会按照设置的flex-shrink和flex-basis乘积的比例来收缩，适应容器大小。在满足“延申条件”时，flex容器中的项目会按照设置的flex-grow值的比例来延申，占满容器剩余空间。描述flex-grow，flex-shrink，flex-basis。按照各自的规则取值即可。
2023-02-22 11:03:46
1788
原创 解决git合并的冲突问题
解决冲突的最好方案是：只保留远程仓库的代码，剪切你的修改，等到合并成功后再对文件进行修改并重新提交同时保留远程仓库的代码和你的代码，合并可以成功使用IDE提供的merge editor，可以选择性保留任意内容git pull之前修改：只保证工作区做出了修改，如果提交到了版本库，那么使用git reset撤销提交。之后使用git stash将工作区修改缓存进栈。之后git pull下拉代码，直接进行fast forward合并。
2023-02-22 11:03:35
3367
原创 git merge和git rebase命令
参考链接：https://www.cnblogs.com/michael-xiang/p/13179837.html学习背景：已经学习过git，但是实践较少，未和他人协作。
2023-02-22 11:01:11
573
翻译 支持向量机论文翻译——使用不匹配字符串核函数的支持向量机进行蛋白质分类 Mismatch String Kernels for SVM Protein Classification
免费查看该论文的链接：论文链接摘要：我们介绍了一种字符串核函数（注：支持向量机SVM中数据升维使用核函数），叫做字符串不匹配核函数。基于这种核函数（注：核函数是支持向量机的核心，知核函数，可进行分类）的支持向量机SVM用于解决蛋白质分类问题。 这种支持向量机SVM分类的依据是蛋白质序列中长度为K的子序列和序列中m个不匹配位置（注：就是k和m作为核函数的参数，具体参见下文核函数公式）并且不需要依赖任何生成模型来计算生成序列（注：没读懂，表示牛逼）。我们使用不匹配的树型数据结构来高效计算核函数（注：不清楚具
2022-04-29 20:56:29
715
原创 进程线程与IO
参考：《计算机组成原理》白中英《操作系统》左万历《计算机网络》谢希仁《Unix网络编程》W. Richard Stevens《深入浅出Nodejs》朴灵《JavaScript权威指南（第七版）》David Flanaganhttps://mp.weixin.qq.com/s/YdIdoZ_yusVWza1PU7lWaw IO多路复用http://c.biancheng.net/view/1220.html 多线程模型https://zhuanlan.zhihu.com/p/2348886.
2022-03-11 11:49:03
3451
原创 基础线段树数据结构
1.线段树概念线段树简单来说就是仅通过一个数组来描述一棵树。数组中每个元素存储树中对应节点存储的信息，不存储描述树的层次结构的信息。注：这和树状数组的描述很像，因为线段树是一棵平衡二叉树（具体证明不在此演示）不需要特定存储层次结构信息，树状数组的父子节点具有特殊的与关系，也不需要存储特定的层次结构信息。2.线段树的存储2.1 线段树的核心性质（每个节点存储着一个区间的区间和） 每个线段树节点存储两个边界值，表示区间的左右边界，除此之外应存储一个区间和变量，用于记录区间的和，当前节点的区间和等于
2022-03-07 23:12:34
545
原创 JavaScript数据存储与内存关系
参考https://www.zhihu.com/question/482433315/answer/2083349992https://bbs.youkuaiyun.com/topics/390355334https://hashnode.com/post/does-javascript-use-stack-or-heap-for-memory-allocation-or-both-cj5jl90xl01nh1twuv8ug0bjkhttps://zhuanlan.zhihu.com/p/362219811.
2022-03-01 18:03:23
1410
4
原创 最短路算法
1.Dijkstra算法1.1 算法流程阐释1.初始化：出发点的最短路长度置为零，其余点的最短路长度置为正无穷。2.n轮松弛：Dij算法将点分为已经求出最短路的点的集合和未求出最短路的点的集合。最终得出结果必须使未求出最短路的点的集合为空，初始时所有点都未求出最短路，因此需要N轮松弛，就是最外层循环次数。3.每轮松弛：在未求出最短路的点的集合中找到距离出发点最近的点：在未求出最短路的点的集合中找到一个到出发点的距离最近的点，把它加入已求出最短路的点的集合。4.每轮松弛：更新该点到所有未求出最
2022-02-27 21:07:10
522
原创 洛谷-不成熟的梦想家
思路：参考“树状数组数据结构”博客，这道题是明显的区间修改，单点查询类型。只不过是将单点查询变了个意思，每次查询队伍的魅力值。队伍的魅力值是由原数列所有元素计算的来的，可以算得上是单点查询。当前的魅力值和上一次的魅力值相比，差异的原因是修改区间的左边界和右边界造成的，在此维护差分数组即可。当前的魅力值因此就可以由上次的魅力值以O(1)的复杂度推出。此题的数据量是2*10^5，计算魅力值时使用O(logn)的算法也可以，也就是用树状数组也能过。但是是用树状数组就没什么意思了，代码变得复杂。树状数组...
2022-02-26 16:29:22
387
原创 CSP-1序列查询
思路一：二分查找遍历0-N来计算f(i)是不可避免的，至少有O(N)的复杂度。题目中提到A数列是不下降序列，且有“查找最大的不大于x的下标”的语句，不难想到二分查找。在计算每个f(i)时，使用二分查找的复杂度是O(logn)，计算所有f(i)的复杂度就是O(N*logn)。最终复杂度就是O(N*longn)。#include <iostream>using namespace std;int ar[201];int find(int* arr, int n, int ta...
2022-02-24 20:49:33
2595
原创 CSP-2对拍程序
拿“序列新解查询”为例来说明对拍程序的使用1.你的待验证代码 mine.cpp题目样例很少，我们需要自己制造更多样例。#include <iostream>#include <cmath>using namespace std;#define ll long long ll getFSum(int x, int y, int i) { return (ll)(x - y) * i;}ll getGSum(int pos, int r) { int s
2022-02-24 20:47:25
1043
原创 CSP-2序列查询新解
思路：回顾序列查询：本题是“序列查询”的延续，在序列查询中介绍了最优方法是O(n)，遍历原数列，原数列中大于0的差分a[i + 1] - a[i]的含义就是在该区间内的f(k)，k∈[a[i], a[i + 1])的值都为i。在本题中继续延续该思路即可，如果是暴力法，遍历[0, N)再对于每个值在原数列中二分查找答案，这样复杂度是O(N*logn)，N是10^9，肯定超时。尝试直接使用公式求g数列某个区间的和：本题先确定差分的含义（如上），根据差分容易求出差分值对应区间所有f(i)的和。观察...
2022-02-24 20:45:14
3482
3
原创 CSP-2期末预测之最加阈值
思路一：二分查找如果使用暴力法，在尝试每一个y值时都要遍历一遍数列做对比，查询总时间是O(n^2)，对于每一个y都是O(n)的查询时间。对于y的查询推测可以降低到O(1)或O(logn)级别，对于O(1)级别，一定是有公式可以直接推导出该y值能够准确预测的数目。如果能够将及格的同学和不及格的同学分开，然后将其升序排序，此时对于一个y值就可以快速找到其能正确预测的数目，在不及格的同学中，y小于该y值的数目就是在不及格同学中准确预测数目。在及格同学中，y大于等于该y值的数目就是及格同学中准确预测数目...
2022-02-24 09:43:16
693
原创 CSP-2非零段划分
暴力法：复杂度为O(n*m)，m是数列中最大数值，最大为104，n是数列元素个数，最大为5*105。p的取值为[1, max(ar) +1]``````max(ar)指给出数列中最大的元素。遍历p的所有取值，然后对于每个取值都去原数列中计算一下非零段个数。这样遍历所有的p可能的取值，复杂度是O(m)。查询对应取值下非零段的数量的复杂度是O(n)。总复杂度是O(n*m)。思路一：差分数列复杂度为O(m2)，m是数列中最大数值，最大为104。p的取值为[1, max(ar) +1]````...
2022-02-24 09:40:33
719
原创 CSP-2邻域均值
邻域均值题目背景顿顿在学习了数字图像处理后，想要对手上的一副灰度图像进行降噪处理。不过该图像仅在较暗区域有很多噪点，如果贸然对全图进行降噪，会在抹去噪点的同时也模糊了原有图像。因此顿顿打算先使用邻域均值来判断一个像素是否处于较暗区域，然后仅对处于较暗区域的像素进行降噪处理。问题描述待处理的灰度图像长宽皆为n个像素，可以表示为一个n×n大小的矩阵A，其中每个元素是一个[0,L)范围内的整数，表示对应位置像素的灰度值。对于矩阵中任意一个元素Aij（0≤i,j<n），其邻域定义为附近若干元素的集和
2022-02-24 09:36:55
1888
2
原创 树状数组数据结构
1.树状数组概念树状数组简单来说就是仅通过一个数组来描述一棵树或一个森林。数组中每个元素只存储着树中对应节点存储的信息，不存储描述树的层次结构的信息。2.普通树的存储对于一棵普通的树，在《数据结构》严蔚敏版中提到可以使用如下方法进行存储：2.1 父节点表示法用一个数组中存储节点信息，节点信息包括节点存储数据和父节点编号。struct Node { int data; // 节点存储的数据 int parent; // 节点对应的父节点的编号}struct Tree {
2022-02-22 21:46:47
2804
1
原创 静态查找表算法
1.二分查找的前提：二分查找属于静态查找表系列算法的有序表查找算法，意思就是二分查找应该使用在有序数列中，数列必须是升序或者降序排列。2.主流二分查找应用场景：2.1 二分查找目标值int find(int *ar, int l, int r, int target) { while(l <= r) { int mid = (l + r) / 2; if(ar[mid] == target) return mid; else if(ar[mid] > target)
2022-02-21 23:22:34
518
原创 Vue模板编译
1.模板编译流程1.1 模板编译在整个渲染过程中的位置1.2 模板编译的流程1.2.1 解析器：HTML解析器： 解析HTML代码。明确标签的父子节点（使用栈来维护父子节点关系，详细介绍可以参考另一篇博客“浏览器渲染”），明确有哪些标签，明确标签有哪些属性等等。文本解析器： 普通文本并不需要解析，这是用来解析模板中动态绑定的数据。过滤器解析器： 解析Vue使用的过滤器。解析器的输出： 解析器输出抽象语法树AST来描述节点信息和父子节点关系（关于AST的介绍可以参考另一篇博客“解释器和编译器
2022-02-14 13:27:38
2173
原创 Vue虚拟DOM
1.Vue中虚拟DOM的诞生原因1.1 Vue中的MVVM框架1. View： DOM和CSSOM是View部分，负责视图2. ViewModel： Vue框架是ViewModel部分，负责双向数据绑定3. Model： Vue框架下的JavaScript代码是是Model部分，负责提供数据和操作4. 双向数据绑定： 在“Vue深入响应式原理”这篇博客中，已经探究并实现了Vue中的数据绑定。即在ViewModel中实现绑定机制，使Model中的数据变化会导致View的变化。这是一个Model到Vi
2022-02-13 17:22:54
1007
原创 JavaScript模拟退火
1.金属退火1.1 金属退火概念：金属退火是一种化学上的热处理技术，指的是将金属加热到一定温度后再以适宜速度冷却。金属退火可以改变金属的一些物理性质，化学性质，以达到某种特殊的用途。1.2 金属退火化学模型：加热后金属原子最初处于某种活跃的状态，此时原子的活跃程度为x1，金属的内能E(x1)可由x得来，温度为T1降温时金属原子的活跃程度逐渐下降，此时原子的活跃程度为x2，金属的内能E(x2)可由x得来，温度为T2当温度降至稳定温度时金属原子的活跃程度最低，此时原子的活跃程度为x3，金属的内能E(
2022-02-08 20:48:02
1434
原创 Vue响应式原理
参考：<<深入浅出Vue.js>> 第二章 Object的变化侦测Vue2.x和Vue3.x官网关于<<深入响应式原理>>的介绍<<JavaScript权威指南(第七版)>>1.追踪对象变化的方法Vue2.x在组件创建时，Vue2.x系列使用了Object.defineProperty来给组件中的data的每个属性设置为访问器属性。效果是：访问器属性拥有setter，可以探测到属性值的修改缺点是：访问器属性具有局限性.
2022-02-07 21:49:30
1686
原创 手写JavaScript面向对象API底层代码实现
注：本篇博客续上一篇“异步编程函数式编程底层代码手写”，因此编号从13开始13. instanceof操作符的实现function imitateInstanceof(left, right) { // 开启尾调用优化条件 "use strict"; // 检查右值是否有[Symbol.hasInstance]属性 if (right && !right[Symbol.hasInstance]) throw new TypeError("
2022-02-06 22:16:50
586
原创 Vue模块规范
参考并修改：https://blog.youkuaiyun.com/fyyyr/article/details/83657828https://webpack.js.org/configuration/resolve/https://www.webpackjs.com/configuration/resolve/https://www.cnblogs.com/goloving/p/8889585.html引言在ES6的模块系统中import from后跟的是路径+文件名，文件名必须带上js后缀。在Com.
2022-02-06 20:45:14
754
原创 清除浮动的方法
浮动副作用介绍：<div style="width: 250px; background: blue;"> <div style="width: 50px; height: 50px; background: red; display: inline-block; float: left;"></div> <div style="width: 50px; height: 50px; background: red; display: inline-
2022-02-01 13:11:44
421
原创 消除行内块元素水平间隙的方法
水平间隙介绍：水平间隙一般是指行内块元素连续排列造成的水平间隙，示例如下：<div style="width: 250px; height: 100px; background: blue;"> <div style="width: 50px; height: 50px; background: red; display: inline-block;"></div> <div style="width: 50px; height: 50px; b
2022-02-01 13:10:27
1354
原创 BFC和IFC
参考&翻译：https://www.w3.org/TR/CSS2/visuren.html 可视化盒模型1.BFC1.1 BFC概念：BFC： Block Formatting Context 块级格式化上下文1.2 BFC触发：在某个元素上设置以下属性，那么该元素内部将成为一个BFC空间overflow属性不是visible，通常设置为autofloat属性不是noneposition属性不是relative和staticdisplay为inline-block或table-c
2022-02-01 13:08:56
634
原创 水平居中和垂直居中方法
参考并稍作修改：https://juejin.cn/post/6844903799446831117#heading-5https://juejin.cn/post/6844903474879004680#heading-0https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content1.水平居中1.行内元素的水平居中方法： 在行内元素的父元素上设置text-align: center;2.块级元素的水平居中方法： 在块级元素上设置m
2022-01-28 20:50:45
4461
原创 客户端JavaScript的线程池设计
1.介绍：本打算在客户端JavaScript进行机器学习算法计算时应用线程池来优化，就像(http://playground.tensorflow.org)演示的神经网络。但是由于各种原因不了了之了。本次遇到了一个新的问题，客户端的MD5运算也是耗时操作，如果同时对多个字符串或文件进行MD5加密就可以使用线程池来优化。2.准备工作：到npm官网搜索spark-md5，到其github仓库下载spark-md5.js。该js文件支持AMD，CommonJS和web工作线程的模块系统，我们在实现线程池时，
2022-01-23 21:44:58
1643
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人