koa 快速开发一个文件服务器
一个网盘类型的项目，肯定离不开文件系统。用于快速验证流程，这里使用了 node koa 作为文件系统服务，运行在本地。 初始化项目 照着 koa 官方文档来，当然是没有错的。但是为了更好的开发，我们需要引入更多的依赖，后续逐步添加也可以。 ...
Electron-forge + Vite + Typescript + Vue3 初始化项目
初始化 Electron Vite + TypeScript npm init electron-app@latest my-new-app -- --template=vite-typescript 安装 Vue3 npm install vue@latest 安装 Vue3 插件 npm install @vitejs/plugin-vue 修改 renderer 配置 vite.renderer.config.ts import { defineConfig } from 'vite'; import vue from '@vitejs/plugin-vue'; // https://vitejs.dev/config export default defineConfig({ plugins: [vue()], }); 调整目录(按需) ├── main.ts ├── preload.ts ├── renderer │ ├── App.vue │ └── index.ts └── types 调整 index.html 入口文件 src="/src/renderer/index.ts" <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Hello World!</title> </head> <body> <div id="app"></div> <script type="module" src="/src/renderer/index.ts"></script> </body> </html> 调整脚本入口文件 /src/renderer/index.ts ...
几个关于字体和Electron有趣的面试题
经过这么些面试，对于所做过的字体和 Electron，要么不根据项目来问，直接就是 Vue 原理，要么就是前端八股，最多也就是几个简单的 Electron 使用的问题。没想到在非互联网大厂的面试，碰到几个非常有意思的问题。 ...
用了这么多年的字体，你知道它是怎么解析的吗？
大家好呀。 因为之前有过字体解析的相关代码开发，一直想把这个过程记录下来，总觉得这个并不是很难，自认为了解得不算全面，就一拖再拖了。今天仅做简单的抛砖引玉，通过本篇文章，可以知道Opentype.js是如何解析字体的。在遇到对应问题的时候，可以有其它的思路去解决。比如：.ttc的解析。又或者好奇我们开发软件过程中字体是如何解析的。 ...
学习和研究Figma：WebviewTag 还是BrowserView？
大家好。 今天继续来学习Figma客户端。在看Electron Web Embeds 文档的时候，知道官方因为Webview结构还在发生变化，而不推荐使用。但如果锁定Electron版本不再升级，这种不用考虑结构变动的情况下，到底应该使用WebviewTag还是BrowserView呢？ ...
学习和研究Figma：直接看代码(Extract Asar)
大家好呀，时隔两月，今天又来学习和研究figma客户端了。不管是从什么角度去揣测，分析，今天不如更直接一些，看代码！虽然是压缩混淆过的。 过程仅供交流学习 过程仅供交流学习 过程仅供交流学习 ...
在没有设计师的时候，怎么拥有自己的颜色主题
对于当前互联网产品开发中，协调的颜色设计至关重要，甚至决定用户是否愿意主动使用产品。一些独立开发者、中小微企业，在没有设计师的时候，是否就无法拥有至少合理、方便使用的配色方案呢？当然不了。我们可以使用很多现成的组件库，解决方案等等，但是如果在不引入组件库的时候呢？material-color-utilities给我们提供了方案。 ...
99%手写的Promise，都没法过的case
今儿个朋友在重构代码的时候，和我吐槽了如下题这么个代码。让判断下调用顺序，真是Promise写出了callback的感觉。 先不看答案，试试能不能解答正确。 这道题可以说99%手写的promise都不能正确输出。 答案由Google Chrome 控制台输出（目前使用的是 125.0.6422.176 正式版本，arm64架构）。 ...
手写面试题
手写call、apply、bind 区别： call 接收多个参数 apply 接收数组 bind 返回函数，不直接调用。能够分两次接收参数。 原理上就是把function挂在target对象上面，通过target.function 的方式，隐式的将执行上下文修改。 ...
原型链
原型链是JavaScript中实现继承和对象间属性共享的一种机制。 当谈到继承时，JavaScript 只有一种结构：对象。每个实例对象（object）都有一个私有属性（称之为 proto ）指向它的构造函数的原型对象（prototype）。该原型对象也有一个自己的原型对象（proto），层层向上直到一个对象的原型对象为 null。根据定义，null 没有原型，并作为这个原型链中的最后一个环节。 ...