My passion for productivity and creativity has driven me to work on various projects, from front-end development to full-stack development, from desktop apps to mobile apps, and from user experience to developer experience. I strive to push the boundaries of technology to enhance the experience for users and streamline workflow for developers.
Hey, I'm Doray
德国找工作签证的申请流程与经验之广东地区
本篇主要分享我去年（2023 年）在广东申请德国“找工作签” Job Seeker Visa 的流程、经验和想法，其中填写指南部分（包括简历、动机信、签证申请表）仅供参考，同时分享了最繁琐的学历认证 Statement of Compatibility 的相关流程与资料准备，还有一些租房、保险、银行卡、费用等注意事项，以及抵达德国的后续流程。
ZH
Use SVGs as React Components in Astro
Migrating a website from Next.js to Astro (v4/v3), one challenge was faced using SVGs as React Components in Astro. While Next.js easily converts SVGs to React Components, Astro's default setting processes them as a base64 data URL. The solution involves utilizing the Vite bundler's vite-plugin-svgr. The approach is versatile, supporting multiple frameworks, but we should use updated Astro versions to ensure smooth SVG conversions.
EN
Five Challenges When Using WebAssembly, Golang, and TypeScript
Five challenges encountered while using WebAssembly as a bridge between Golang and NodeJS runtimes. The issues include a WASM file compilation error, missing WASM import arguments, unavailable crypto.getRandomValues, declaring variables in globalThis in TypeScript, and treating Golang + WASM as an application instead of a library. The solutions include setting environment variables, importing wasm_exec.js file, providing a polyfill for crypto.getRandomValues, augmenting global type definitions, and using Golang's Channel to prevent the runtime from shutting down.
EN
Why Angular Uses NgModules With ESModules
一月份面试时遇到位面试官，他问道：为什么 Angular 至今依然坚持使用 NgModules 而不是 ESModules 呢？当时回答得比较肤浅，主要提到“Angular 对模块理念的重视与推崇，因而需要一套更好的机制解决模块的依赖问题，而这套机制遵循了控制反转原则并以依赖注入的方式实现，这是 ESModules 无法做到的”。
ZH
Repertoire Method for Solving Recurrences
《具体数学：计算机科学基础（第二版）》第一章的“约瑟夫问题”中，介绍了一种求解递归式的奇妙技巧 —— Repertoire Method。这种技巧帮助我们将特殊解推向一般解：通过一些已知其解的参数函数，从特殊的情形推向一般的情形。
ZH
A Variation of Hanoi Problem
这道题目来自《具体数学：计算机科学基础（第二版）》第一章习题中“热身题”部分的第二题：把有 N 个圆盘的塔从左边的桩柱 A 移动到右边的桩柱 B，不允许在 A 和 B 之间直接移动，求最短的移动序列（每一次移动都必须是移动到中间的桩柱或者从中间的桩柱移出。较大的圆盘永远不能放在较小的圆盘的上面）。
ZH
Caveats of ngVue: Using Vue2 Into AngularJS
The ngVue module allows you to use Vue components in AngularJS applications, making change detection efficient but complicated. AngularJS uses a dirty checking mechanism while VueJS uses a reactivity system. ngVue makes use of the reactivity system in the dirty checking mechanism, but has limitations in detecting changes to models. Solutions include using Vue.set() to add properties and Array.prototype.splice to mutate arrays.
EN
Why Array Index as Key Is Bad in React
从上一篇笔记分析，key 属性是优化列表结点的主要方式，而稳定、唯一、可预测的 key 属性有助于 Diff 算法计算出准确的 DOM 操作，然而数组的索引虽然唯一，但是并不"稳定"，也难以预测
ZH
Introduction to Assumptions Made in React Reconciliation
每当 state 发生变化，ReactJS 就会重新渲染新的 Virtual DOM，接着执行 Diff 算法与旧的 Virtual DOM 比较，计算出差异，最后执行 DOM 操作。ReactJS 基于以下两个假设优化了标准实现的 Diff 算法
ZH
Unary map(parseInt) to Fix the Not-A-Number Issue
The example of numbers.map(parseInt) in JavaScript shows how the Array.prototype.map method calls the provided parseInt function once for each element in the array and converts strings into integers. However, the actual result failed and made the last two elements NaN. This is because parseInt only defines two parameters: string and radix, and the third argument in numbers.map(parseInt) is ignored. Solutions include using Lodash's unary method or Vanilla JS's unary and ary-like functions, or simply using numbers.map(str => parseInt(str, 10)).
EN