- 博客(88)
- 收藏
- 关注
RSS订阅
原创 前端面试题
对于 html 的标准属性来说，attribute 和 property 是同步的，是会自动更新的。attribute 是 dom 元素在文档中作为 html 标签拥有的属性。property 就是 dom 元素在 js 中作为对象拥有的属性。attribute 和 property 的区别是什么?但是对于自定义的属性来说，他们是不同步的。script 引入方式?
2022-11-17 11:29:18
471
原创 Flutter中组件Widget的粗解
Flutter 中是通过 Widget 嵌套 Widget 的方式来构建UI和进行事件处理的，所以记住，Flutter 中万物皆为Widget。widget 的功能是“就是说， Widget 其实并不是表示最终绘制在设备屏幕上的显示元素。
2024-04-23 15:27:15
737
原创 学会这些思维框架，提高综合决策能力
用实践来体验真实世界，但这个并不妨碍你对梨子的认知，同时和王阳明在“龙场悟道”所说的“心即理”，要观照自己的心里所想，并做到“知行合一”，在知中行，在行中知。《思考的框架》这本书介绍的9个思考框架，就可以锻炼思维，帮助我们更好地决策。在一阶思维下，我们能预见自己的行动造成的直接后果，二阶思维要求我们考虑结果背后的结果，把长远利益放在短期利益之上。世界是动态的，地图必然有缺 陷，它的价值在于帮助我们预测或解释事物，模型也是如此，现实是复杂的，模型是简化的。跟复杂的解释相比，简单的解释更有可能是正确的。
2024-04-23 10:45:50
773
原创 husky配置实现代码提交前校验与规范提交信息
husky是一个Git Hook管理工具，主要用于实现提交前eslint校验和commit信息的规范校验。Husky 的原理是让我们在项目根目录中写一个配置文件，然后在安装 Husky的时候把配置文件和 Git Hook 关联起来，这样我们就能在团队中使用 Git Hook 了。首先，确保已经安装了husky和commitlint。在项目中启用husky钩子，事实上是在项目根目录生成配置文件的文件夹（.husky）。查看，可以看到配置中修改了指向为.husky。
2024-03-28 13:40:55
1083
原创 Flutter 绘制原理
综合以上两点，我们可以看到 PictureLayer 的“绘制产物”一开始是一些列“绘图指令”，当第一次绘制完成后，位图信息就会被缓存，绘制指令也就不会再被执行了，所以这时“绘制产物”就是位图了。为了便于理解，后续我们可以认为指的就是绘制好的位图。也应该是树状结构，Flutter 会根据一些“特定的规则”（后面解释）为组件树生成一棵 Layer 树，而容器类Layer就可以组成树状结构（父 Layer 可以包含任意多个子 Layer，子Layer又可以包含任意多个子Layer）。
2024-03-27 18:27:17
615
原创 flutter布局更新
理论上，某个组件的布局变化后，就可能会影响其他组件的布局，所以当有组件布局发生变化后，最笨的办法是对整棵组件树 relayout（重新布局）！但是对所有组件进行 relayout 的成本还是太大，所以我们需要探索一下降低 relayout 成本的方案。实际上，在一些特定场景下，组件发生变化后我们只需要对部分组件进行重新布局即可（而无需对整棵树 relayout ）
2024-03-27 16:27:10
1117
原创 Flutter Widgets体系结构
在Flutter的Dart语言中，`this`关键字被用来引用当前对象的实例成员（属性或方法）。当你在类的方法中访问同一个类的另一个方法或变量时，可以使用`this`关键字，尤其是当参数名称与成员变量名相同，从而需要区分作用域时，也可以直接省略。在Flutter widget树构建方法（例如`build`方法）中，你可能需要访问当前widget的属性或调用它的方法。在不考虑整棵树的情况下，几乎不可能精确定义任何 widget 的大小和位置。引用当前对象的属性或方法的关键字widget和this的区别。
2024-03-14 17:13:04
875
原创 flutter环境搭建实践
Dart 是一种客户端和服务器端的编程语言，最早由 Google 提出。它被设计用于构建高性能、高度可伸缩和可靠的应用程序。Dart 可以编译成本地代码或者在虚拟机中直接运行。在移动应用开发中，Dart 主要用于开发 Flutter 应用。
2024-03-14 10:36:31
806
原创 Babel原理
根据配置好的 plugins/presets 把 Parser 生成的 AST 转变为新的 AST。将代码转换成抽象语法树 (AbstractSyntaxTree，简称 AST)词法分析：将字符串形式的代码分割为令牌（token）流，即语法单元成的数组。语法分析：将token流转换成 AST。把新的 AST 生成代码。
2024-03-12 16:22:38
218
原创 弱缓存变强缓存的原因
强缓存就是为了给客户端自给自足用的，在客户端控制。如果资源没过期，就取缓存，如果过期了，则请求服务器。如果资源有更改，返回200，返回最新的资源，如果资源没更改，返回304，浏览器读取本地缓存。协商缓存无论如果，都要向服务端发请求的，只不过，资源未更改时，返回的只是header信息，所以size很小；而资源有更改时，还要返回body数据，所以size会大。用户行为对缓存的影响F5 会跳过强缓存规则，直接走协商缓存Ctrl+F5 跳过所有缓存规则，和第一次请求一样，重新获取资源配置资源的缓存规则。
2024-03-12 10:27:00
824
原创 浏览器进程、线程、线程池解释及使用
线程池是一种用于管理线程的集合，以提高内存和CPU效率。它通过一次性创建一定数量的线程，并当有新的请求到来时，直接使用已创建的线程来处理请求，从而避免了频繁地创建和销毁线程的开销。线程池中的线程可以被多个请求共享，因此可以更有效地利用系统资源。
2024-03-06 15:32:02
996
原创 js新增的操作元素类名的方法
在不同的环境中，全局对象可能有所不同，例如在浏览器中是 window，在 Node.js 中是 global。globalThis 的出现就是为了解决这个问题，它使得在任何环境中都可以使用统一的接口来访问全局对象。这可以用于操作 class 集合。属性自身是只读的，但是你可以使用。是一个只读属性，返回一个元素。
2024-02-01 18:48:34
254
原创 小程序跳转：云开发之h5跳小程序
经过测试，发现中转的h5页面也可以放在自己公司的静态服务器上面，但带来的问题是在手机端微信内通过链接打开h5页，wx-open-launch-weapp开放标签按钮不显示，没有办法去到小程序。后面想到改用a标签，此种方式可以实现跳转，但是在一些机器上面（特别是安卓），会直接跳转到微信并打开目标小程序。配置的wx-open-launch-weapp开放标签按钮，需要主动点击才会打开目标小程序，避免了无感知和某些政策审核问题。wx-open-launch-weapp开放标签按钮不显示，下面是一些参考文章。
2024-02-01 17:58:29
320
原创 外链跳转微信小程序的几种实现
第一种方法:通过公众号文章来实现，公众号文章页面，可以插入小程序 公众号 视频号的功能，发布一篇图文，发布后，用短链接生成一个短链就可以做短信发送了；第二种方法：通过第三方工具，比如 小月外链 虾果 可以搜索引擎搜索一下，有全部的解决方案，就是支持微信外部一键唤醒微信进入相应的内容；第三种方法：通过微信客服（需要有企业微信申请）的链接可以设置跳转微信小程序 以及第三方链接，功能很强，有空的朋友可以去了解一下。以上三种方法操作都很简单。
2024-01-22 18:56:16
891
原创 通过浏览器判断是否安装APP
求在分享出来的h5页面中，有一个立即打开的按钮，如果本地安装了我们的app，那么点击就直接唤本地app，如果没有安装，则跳转到下载。
2024-01-15 18:04:53
1280
原创 JsonPath
JsonPath是一种用于处理JSON数据的查询语言，它允许你通过路径表达式在JSON文档中查找和访问节点。JsonPath还支持函数和过滤器，函数可以在JsonPath表达式执行后进行调用，其输入值为表达式的结果。过滤器是用于过滤数组的逻辑表达式，可以通过逻辑表达式&&或||组合多个过滤器表达式。JsonPath的路径表达式由节点名组成，节点之间以"."分割，且路径必须是从根节点开始的完全绝对路径，并提供类似正则表达式的功能，能够满足各种复杂的查询需求。
2024-01-12 16:19:57
594
原创 HTTP的Content-type 和 responseType
后端返回字节流，前端进行图片下载时遇到了问题，定位花了不少时间，本文再次记录梳理下。
2024-01-12 14:46:14
1451
原创 前端moa gif json显示动画
使用requestAnimationFrame()方法创建一个动画函数，将JSON文件的数据传递给该函数，使用Web动画API创建一个SVG动画，并将JSON数据渲染到SVG动画中。
2024-01-11 17:15:34
626
原创 后端返回文件流乱码，responseType:‘blob‘无效的问题
项目中使用的mock.js模拟数据，http请求库使用的是axios，业务场景是请求后台接口，返回二进制数据，展示为图片。此时使用的是正式数据，仅仅是引入了mock并没有使用，结果前端展示不出来。开始漫长的网上找跳坑大法之路，发现了一篇文章，mock模块会修改原生ajax，使得responseType的值变成‘’空字符串。后来考虑axios设置content-type：blob和arraybuffer不同的问题，发现也不是。首先想到的是后台返回的格式本身是错误的，通过在后台打开发现没问题。
2024-01-11 16:14:48
656
原创 浮点数计算
为什么 0.1 + 0.2!== 0.3, 而 0.05 + 0.25 === 0.3js在计算浮点数时可能不够准确，会产生舍入误差的问题，这是使用基于二进制数值的浮点计算的通病，并非ECMAScript一家，其他使用相同数值格式的语言也存在这个问题。Number。使用 64 位固定长度来表示，也就是标准的。这样的存储结构优点是可以归一化处理整数和小数，节省存储空间。这64第1位: 是符号的标志位(S), 0代表正数，1代表负数第1-11位。
2024-01-09 15:19:59
476
原创 git常用命令及概念对比
git config --list 查看git的配置git status 查看暂存区和工作区的变化内容（查看工作区和暂存区有哪些修改）git log 查看当前分支的commit 记录git log -p commitID详细查看commitID的具体内容git log -L :funcName:fileName 查看fileName文件中funcName函数的修改历史。
2024-01-06 12:49:04
1093
原创 html渲染优先级
在前端开发中，优先布局是指在设计和构建页面时，将页面的各个部分按照其重要性和优先级进行排序，并依次进行布局和开发。这种方法可以帮助开发团队在项目初期就确定页面结构的核心部分，从而更好地掌控项目的整体进度和优先级。且确保在网络环境差的情况下，优先渲染重要内容在CSS中，元素的渲染优先级是由决定的。一般来说，块级元素的渲染优先级高于行内元素，而行内元素的渲染优先级又高于浮动元素和定位元素。
2024-01-02 15:32:20
1331
原创 层叠上下文（Stacking Context）和包含块（Containing Block）
层叠上下文（Stacking Context）是HTML中的一个三维概念，它影响着元素的堆叠顺序和显示效果。在同一层叠上下文中，如果两个元素的层叠级别相同，则后面的元素在前面的元素的上面，遵循后来者居上的原则。在不同的层叠上下文中，我们比较的是“父级元素层叠级别”。
2024-01-02 15:19:42
319
原创 uniapp问题总结
通过`background-image`设置背景图片，超过30k左右就会报错。通过`image`的src设置图片，超过50k左右就会报错。将图片文件托管到oss，请求云端的图片数据。
2023-12-22 14:52:39
344
原创 小程序分享携带参数，被覆盖问题
子组件中写了‘onShareAppMessage’和‘onShareTimeLine’，父组件中也写了这两个函数，并且在url中携带了参数，发现分享后在分享页‘onLoad’中取不到参数。
2023-12-22 14:39:06
924
原创 uniapp怎么获取微信步数
微信步数是指用户在微信运动中记录的步数数据。微信提供了开放能力，允许第三方应用获取用户授权后的微信步数数据，以便进行进一步的数据分析和展示。使用时报错：fail api scope is not declared in the privacy agreement。出现这些问题是因为需要更新！！！
2023-12-17 22:10:36
761
原创 小程序商城活动页面怎么生成二维码
小程序商城某些页面需要做成活动推广页，或需要某一个页面做成二维码进行推广。比如某些非公开的商品做成一个活动，发送指定部分用户，这个活动页面可以做成二维码。
2023-12-17 21:42:12
46
原创 vue.config.js文件重写打包工具配置信息
是一个可选的配置文件，可以在其中定义一些自定义的配置选项，以覆盖 Vite 的默认配置。你可以在这个文件中引入 Vite 的相关模块，然后使用 Vite 的 API 来修改或扩展默认配置。你还可以根据需要添加其他的自定义配置选项，例如别名（alias）和构建选项（build options）。文件生效，确保将其放置在项目的根目录下，并在 Vite 的配置中引用它。例如，如果你使用的是 Vite 的。在构建过程中，Vite 将使用这个新的输出目录来生成构建结果。是的，你可以在 Vue 项目中使用。
2023-12-05 18:54:44
258
原创 浅谈ArrayBuffer、Blob和File、FileReader
ArrayBuffer、Blob和File之间的关系是，你可以通过File对象获取到Blob对象，然后通过Blob对象获取到ArrayBuffer对象。反过来，你可以通过创建一个新的Blob对象，然后使用它来创建一个新的File对象，从而将ArrayBuffer对象转换为File对象。ArrayBuffer对象用于表示一个通用的、固定长度的原始二进制数据缓冲区。它通常用于读取用户上传的文件内容，或者用于构建FileList对象，后者可以用于元素的multiple属性。
2023-12-05 18:53:57
556
原创 vite初识
Vite一开始会去加载index.html文件，然后通过script标签加载main.js，这其实和Vite的编译特性有关，传统的例如webpack的构建打包方式，启动必须优先抓取并构建你的整个应用，然后才能提供服务。
2023-12-05 18:53:23
60
原创 uniapp打包的h5项目多了接口调用https://api.next.bspapp.com/client
这个实际上是因为该项目在manifest.json文件中勾选了‘uni统计配置’导致的，取消勾选就可以了。如果是小程序项目，在小程序开发者工具中添加可信任域名就可以了。
2023-12-04 16:56:56
609
原创 js中（）的作用
如果 `a` 的初始值是 falsy（如 `null`、`undefined`、`0`、`NaN`、`''`），那么表达式的结果就是 `a` 的当前值（因为 `false && anything` 总是返回 `false`），因此不会执行右侧的赋值操作。这里，`a ||= b` 等价于 `a = (a || b)`。如果 `a` 的初始值是 truthy，那么表达式的结果就是 `a` 的当前值（因为 `true || anything` 总是返回 `true`），因此不会执行右侧的赋值操作。
2023-12-04 13:45:16
225
原创 webpack查找配置文件的策略
需要注意的是，这些查找策略是依次进行的，一旦找到符合条件的配置文件，Webpac就会停止继续查找并开始处理找到的配置文件。如果希望同时使用多个配置文件，可以使用 `webpack-merge` 这样的库来合并它们。如果在项目根目录下的 `package.json` 文件中有一个名为 `webpack` 的属性，Webpack 会将该属性视为一个对象，并用作配置。如果在运行 Webpack 时通过 `--config` 或 `-c` 参数指定了配置文件的路径，那么 Webpack 将使用这个指定的配置文件。
2023-12-03 19:15:30
131
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人