weixin_58540586的博客

原创 WHAT - 二次贝塞尔曲线和三次贝塞尔曲线

特性二次贝塞尔曲线三次贝塞尔曲线控制点个数34曲线自由度一般更高常用场景简单路径、动画字体、矢量绘图复杂度低高表达能力中强。

原创 WHAT - 前端职场生存指南

主题：前端职场生存指南 - 提升职业竞争力的关键策略。我们将探讨前端开发者在快速变化的技术环境中如何应对职场挑战、提升自身竞争力、掌握必备生存技能，并规划成功的职业发展路径。

原创 HOW - 基于AntV G6 实现 mindmap 形态的数据上下游关系图

【代码】HOW - 基于AntV G6 实现 mindmap 形态的数据上下游关系图。

原创 WHAT - AntV x6 和 AntV g6 如何选择

对比维度G6X6定位图可视化引擎图编辑引擎核心能力关系数据可视化、布局、交互可编辑的图、流程图、DAG 图等适用场景展示类图谱、网络图、关系图编辑类图：流程图、DAG、低代码平台等交互能力支持基本交互（拖拽、缩放、高亮等）支持高级编辑交互（增删改、连线等）扩展性支持自定义图形、布局、交互插件化强，支持自定义节点、命令、行为等渲染方式主要基于 Canvas支持 Canvas 和 SVG与对方关系底层可视化引擎在 G6 基础上构建，更偏向“编辑”场景。

原创 HOW - JavaScript sort 多维度权重排序方案

使用「权重函数 + 数值排序」代替繁复的if✅ 可读性好✅ 可扩展性强✅ 维护成本低✅ 更容易加上次级排序这种模式不仅适用于状态排序，还可以用于任何带有优先级逻辑的排序需求。

原创 WHAT - 依赖管理工具 CocoaPods

CocoaPods是 Ruby 编写的 iOS/macOS 依赖管理工具。它通过Podfile文件定义项目依赖，并自动下载和链接原生库（.framework或React Native 的 iOS 原生模块通常需要CocoaPods来正确集成。操作命令安装 CocoaPods进入 iOS 目录cd ios初始化 Podfilepod init安装依赖更新依赖pod update清理缓存打开 Xcode 项目关键点✅React Native 的 iOS 原生模块需要CocoaPods来正确链接。

原创 WHAT - 博客收录

原创 WHAT - React Native 中 Light and Dark mode 深色模式（黑暗模式）机制

如果你想扩展自己的配色，可以在themes.tscolors: {},colors: {},然后在如果你不想每次都?: {return (<Viewstyle={{flex: 1,}}<Pressable")}style={{}}<Textstyle={{}}</Text></View>这样全局配色集中管理，更清晰、更好维护。无论你是直接用，还是用用系统返回的'light''dark'做分支渲染。系统 ->->-> 组件自动适配。

原创 WHAT - TTF 和 OTF 字体格式

格式全称简介TTF由苹果和微软在1980年代联合开发的字体格式。OTFAdobe和微软开发的更现代的字体格式，基于TTF或PostScript。

原创 WHAT - TanStack 前端工具库合集

在中我们介绍过 TanStack Query. 其实 TanStack 是一个由 Tanner Linsley 创建的前端工具库合集，专注于构建高质量、可组合、无状态的 UI 工具。

原创 HOW - 图像加载自动优化方案

在HOW - next/image Web 图片优化参考指南中我们同样发现next/image具备如下特性：自动优化：next/image 自动优化图像，确保它们以最合适的格式、尺寸和质量加载，提升页面性能。next/image的自动优化能力是 Next.js 的一大亮点，它背后的原理结合了服务端处理（或者边缘函数）和浏览器端的响应式加载。下面是它实现“自动优化图像”的核心机制和原理。功能背后机制自动尺寸srcSet+ 服务端 resize自动格式转换。

原创 HOW - 图片的一倍图、二倍图和三倍图

譬如 React Naitve 框架，可以让系统会自动根据当前设备的PixelRatio选择最合适的资源。另外在中我们同样发现next/image具备如下特性：响应式图片：支持响应式图片，根据不同的设备和屏幕尺寸加载适当大小的图像。

原创 WHAT - React Native 的 Expo Router

解释Expo Router 是一个基于文件系统的路由解决方案，用于 React Native，同时支持 Web 应用。你创建的页面文件（.tsx文件）本身就自动成为导航路由。解释它基于同一个代码结构（页面和组件），实现多端（iOS / Android / Web）的一致导航体验。你写一次页面，在不同平台通用。Expo Router = 基于文件结构的路由系统，让你像写 Web 那样开发原生 App（iOS / Android / Web）页面导航。自动注册路由路由即目录结构。

原创 HOW - 如何使用GitHub Pages免费部署静态网站

在source/目录下新建CNAMEGitHub Pages 会自动识别这个文件用于绑定域名。##常见问题排查问题解决方式页面空白或 404确保部署分支为main并设置了正确 source样式丢失使用相对路径（root: /）配置权限拒绝 deploy配置 SSH key 或使用 Token。

原创 WHAT - 组件库与 Storybook

Storybook是一个用于构建独立组件 UI 的开发环境工具，适合 React、Vue、Angular 等现代前端框架。它允许你在不依赖项目业务的情况下，独立开发、测试和文档化 UI 组件。

原创 WHAT - 如何理解程序中的sleep？以及其在开发场景中发挥了什么作用？

sleep是控制程序“暂停一段时间”的指令，它用于节流、等待资源、模拟延迟或调试，但应谨慎使用，尤其在需要异步或高性能场景中。

原创 WAHT - 箭头函数两个典型场景

场景普通函数的问题箭头函数的解决方案回调函数（如setTimeoutforEachthis指向错误或丢失，需要手动绑定箭头函数继承外层this，无需绑定React 类组件事件处理需要手动绑定this，否则this是undefined箭头函数自动绑定外层this，无需手动绑定React 函数组件事件处理无this问题箭头函数简洁易用箭头函数通过其词法作用域的this绑定机制，极大地简化了我们在处理回调函数和事件时的代码逻辑，避免了传统函数中常见的this绑定陷阱。

原创 WHAT - JavaScript bind vs call vs apply(包括在箭头函数中vs在普通函数中)

在WHAT - JavaScript 的函数你知道多少中我们介绍过bindcallapplyapply 和 call 除了参数形式不同外还有什么区别?bind 和其他两个除了不会立即执行外还有什么区别?这是一个非常好的深入问题！callapply和bind都是 JavaScript 中用来显式设置函数中this值的方法，它们在功能上相似，但在使用方式、执行时机等方面存在一些关键区别。你提到的“参数形式不同”和“是否立即执行”是它们最直观的区别，但实际上它们之间还有更深层次的区别。

原创 WHAT - JavaScript 的函数你知道多少

特性/属性/方法描述定义方式函数声明、函数表达式、箭头函数、构造函数属性namelengthprototype（仅普通函数）方法call()apply()bind()特性一等公民、作用域与闭包、this动态绑定ES6+ 新特性默认参数、剩余参数、参数解构、箭头函数、生成器函数JavaScript 函数非常灵活且功能强大，是构建复杂应用的基础。掌握函数的方方面面对于编写高质量、可维护的 JavaScript 代码至关重要。

原创 WHAT - React Native 开发 App 从 0 到上线全流程周期

从简单到复杂，一步步搭建起自己的项目体系，并随着业务需求灵活调整架构。

原创 WHAT - Expo Go 和 development build

Expo Go是官方提供的一个现成的 App，可以在 iOS 和 Android 应用商店下载安装。你可以把它理解为一个「浏览器」，专门用来“运行”你用 Expo 写的 React Native 项目。你的项目代码Expo 的开发调试工具（比如开发菜单、热更新等）也就是说，它是一个运行你项目的专属开发版本 App，但比 Expo Go 自由度更高。你是这样的人推荐用初学者、刚接触 React Native✅ Expo Go想快速预览页面 UI 效果✅ Expo Go。

原创 WHAT - Expo CLI 的三种连接方式

在使用Expo CLI（开发工具）连接方式简述优点缺点Tunnel通过第三方服务（如 ngrok）将本地服务穿透到公网适用于不同网络环境，跨网络连接最慢，受限于外部服务，可能不稳定LAN使用局域网 IP（如 192.168.x.x）连接手机和电脑快速稳定，只要设备在同一局域网要求手机和电脑在同一个 Wi-Fi 下Local使用localhost或127.0.0.1最快，仅限模拟器使用实机无法访问，仅限本机模拟器问题解决方案Tunnel 太慢优先改用 LAN 或 Local 模式。

原创 WHAT - 为甲方做一个官网（三）- 自主开发版

开发者自主搭建官网的核心优势是灵活性高、可定制性强，但需平衡开发效率与代码质量。通过明确需求、选择合适技术栈、规范开发流程，可在1-3周内交付高质量官网，同时为甲方提供可持续维护的服务。

原创 WHAT - 为甲方做一个官网（二）- 快速版

零代码首选：Wix/凡科建站（拖拽式，适合纯展示）。内容管理首选：阿里云速美站（一键部署WordPress，后台灵活更新）。AI尝鲜首选：Durable（全自动生成功能，适合极简需求）。按照以上方案，即使完全不懂技术，也能在1-5天内完成官网搭建，且成本可控（多数工具提供免费试用或基础版）。

原创 HOW - 基于CodeMirror封装React代码编辑组件

以下是一个基于。

原创 WHAT - 为甲方做一个官网（一）

为甲方制作官网前，需从到全流程梳理确认事项，确保双方理解一致、避免后期返工。

原创 WHAT - 组件库单入口打包和多入口打包

所有组件通过一个统一入口（如index.ts）导出并打包为一个文件（或多个格式，如 ESM/CJS）。目标推荐方式简单快速上线 MVP单入口打包注重组件体积、性能多入口或混合模式提供全量和按需引入能力混合单入口 + 多入口。

原创 WHAT - 组件库开发场景 - 完全无样式的 UI 组件库 Headless UI

可能你听过，这就是一个 Headless UI 组件库。是一个由 Tailwind Labs（也就是 Tailwind CSS 的开发团队）推出的，主要用于 React 和 Vue 项目。

原创 WHAT - script type=“module“

在中我们详细介绍过有关 script 加载的内容，其中提到 es module 加载。是 HTML 中用来加载 JavaScript的一种方式。它与传统的<script>标签不同，具有模块化、作用域隔离、支持等特性。

原创 HOW - 管理密码

管理密码需要安全、系统地进行，以防止账户被盗或数据泄露。

原创 WHAT - 数据分析广告归因（Ad Attribution）

广告归因是一种用于识别和评估用户采取某个行为（例如购买、注册、下载）之前，接触了哪些广告渠道或营销活动的过程。它的目标是回答这样的问题“用户是通过哪些广告或营销渠道最终完成了转化？

原创 HOW - 简历和求职面试宝典（八）

其次，不论你的离职原因是不满意薪资、不适应团队的管理风格还是发展空间到达了上限等，都不要在这里抱怨出来，因为每个公司的 leader 都清楚公司里的问题，与其这样，不如直接告诉 leader，辞职的原因是希望可以有更好的发展，或者是让自己有更好的学习成长的空间。最不建议的离职理由：经常会有小伙伴为了避免双方尴尬，会选择“家人生病需要较长的时间照顾”、“家人要求我回老家工作”等类似这样的理由，如果是真实的当然不会有问题，如果是虚构的，以后万一被发现，则会给前公司留下一个不诚信的印象，以后再相见时会更尴尬。

原创 HOW - 简历和求职面试宝典（七）

二、对于具备一定工作经验的朋友来说，如果你已经是一个在专业领域工作多年的候选人，行业经验也非常丰富，相信丰富的经验可以为你创造比较高的收入，你可以比对行业的知名公司职级的薪资结构去判断自己的薪资情况。你可以参考在之前的工作过程中，是不是有让自己感觉不舒服或者有挫败感的时候，同时想想是什么原因造成的，比如一个极度紧绷的团队氛围让你想要换一份工作，或者迟迟得不到晋升或调薪，然后把它们整理出来写在纸上，标记出来哪些是你希望可以得到改善和需要得到成长的。你是否会有这样的疑惑：我所期望的薪资是否能给到呢？

原创 HOW - 简历和求职面试宝典（六）

此时，可以通过照片网站去搜索密切度高的岗位，然后查看该岗位的职位 JD，建议搜索查看同一岗位的多家职位 JD，把JD 重合的部分标记出来，其实这些就是该岗位所必需的技能；在面试的过程中，还可以通过与面试官的交流去判断这家公司的情况，如果面试官在面试过程中表现的比较有条理、沟通比较有素质，则可以说明这家公司还是不错的选择；确定之后，可以投入时间去锻炼这些技能，或者在一家公司找到实践的机会，慢慢提升自己与想从事的岗位的匹配度，相信通过几年的磨炼，肯定也能更充分地发挥出自己的优势，得到更丰厚的回报。

原创 HOW - 简历和求职面试宝典（五）

此时建议这样回答：“我非常喜欢我的工作，我感觉我的岗位在目前行业的发展中起到了非常重要的作用，我们所做的几个项目都在推动公司的发展，也帮助公司的效率和效益从 XX% 提升到了 XX%（在这里可以举一些自己做过的项目经验），而且我也希望可以继续从事这样的工作，因为它可以让我获得更多的成就感。当面试官听到这样的介绍时，会非常清晰地了解你对自己的工作已经有了深入的思考，同时也能感受到你不止局限在自己的工作领域中，还在通过行业的变化和了解，来规划自己的职业，是一个很有潜力的候选人。1、避免口头禅出现频率过高。

原创 HOW - 简历和求职面试宝典（四）

例如，我希望可以在未来的 1 ~ 2 年内，梳理和参与到几个完整的项目中，从中学习和看到整个项目是什么样的，从而提升自己的工作能力和项目经验。这是面试结束前的最后一个问题，也可以认为是个形式问题或走个流程，此时可根据前面面试过程中的表现程度来适当的提问，比如公司福利、上下班时间、团队氛围、个人岗位发展等，但尽量不要问从网上就能查到公司信息的问题。当然也许你的内心想的是涨薪或者培训，虽然薪资是一定的，但是如果让面试官认为你是一个物质或者情商低的人，并没有长久的培养空间，那面试的结果就可想而知了。

原创 HOW - 简历和求职面试宝典（三）

简历前面准备好了，下面说一下穿着相关的准备。你和面试官属于首次见面，在还没有开始正式聊天之前，他是无法感知你的个人魅力或者知识储备的。假如第一次见面就看到邋遢的外表或者奇怪的着装，或者浓妆艳抹、身上味道过重，面试官会怎么给你贴标签呢？他很大可能会认为你并不尊重这次面试，给他造成一种没有礼貌的印象。所以，干净得体的着装是面试非常重要的一个环节。面试官也会通过你的着装去判断你的性格，以及判断与公司的文化、团队的气氛是否匹配。接下来就是面试的过程了，首先面试官会说：“请简单介绍一下自己。

原创 HOW - 简历和求职面试宝典（二）

这样才会拥有一份完美的简历和一份完整的职业规划。可能很多刚刚毕业的小伙伴会问：“我没有工作经历，也不知道自己做什么。如果我不去尝试怎么可能知道自己适合什么呢？” 其实很多小伙伴在大学读的专业也就已经明确了自己可以从事的方向，当然如果你认为自己读的专业不是你喜欢的，也许可以选择管培生的岗位，用 1 年的时间去体会各个岗位也许会对你有所帮助。

原创 HOW - 简历和求职面试宝典（一）

对于业绩成果，如果工作中有过一些公司认可的奖状或者某一期的绩效非常优异的话，可以在“工作内容描述”后面增加一栏“业绩成果的展示”，但是这一栏的内容不宜过多，把最重要或者很有价值的公司奖项或绩效按照重要程度精简出 1 ~ 3 条即可，如「公司年度优秀员工奖」、「上季度绩效为 A」等。

原创 HOW - 给老板画饼

绩效期想给老板“画饼”，也就是展示你未来能为团队带来的价值，关键是，同时让老板觉得你。