北京十七年 - 我的足迹地图
十七年归来还是北漂
Xhair迁移 - 从Vercel到自部署
Xhair上线后收到一些访问速度的反馈，并且免费额度也有不少限制，因此决定自部署
WASM初探
前言 最近开发上线了xhair.pro, 其核心的数据是通过爬虫下载.dem文件并使用一些开源的解析库如demoinfocs-golang,demoparser解析获取最终的数据 在本地下载解析上传可以随意配置环境，但浏览器无法直接运行Golang或Rust的代码。想要将解析的能力制作成web应用，需要使用WebAssembly技术。 WASM WebAssembly 是一种新的编码方式，可以在现代的 Web 浏览器中运行——它是一种低级的类汇编语言，具有紧凑的二进制格式，可以接近原生的性能运行，并为诸如 C/C++、C# 和 Rust 等语言提供编译目标，以便它们可以在 Web 上运行。它也被设计为可以与 JavaScript 共存，允许两者一起工作。 我们可以把Rust、Go等语言编译成.wasm后缀的二进制文件，浏览器可以通过WebAssembly的API加载该模块，并调用相关能力 实践 不同编程语言需要通过不同的方式编译至wasm，我尝试了Go与Rust。 Golang实践 1. 首先需要配置Go的环境 go 安装 2. 初始化项目 mkdir w
家用服务器公网访问方案
前言 因为ipv4地址数量受限，家庭宽带几乎都没有公网IP。在局域网内可以使用类似192.168.0.100这样的内网IP进行访问，但是想要在外访问或是提供给朋友使用是不行的。 方案一：内网穿透 可以使用具备公网IP的服务器进行中转，用户访问具备公网IP的服务器，该公网服务器再与家庭服务器通信，最终用户访问到家庭内网。 方案对比 方案 价格 优缺点 使用免费服务如ngrok、cloudflare tunnel 无 速度受限，部分功能需要收费如绑定域名 购买云服务器搭建 中 价格高，需要部署维护 购买FRP服务如sakura frp 低 有流量和带宽限制 个人建议 临时需求可以使用ngrok，例如给朋友看正在开发的网站 长期需求建议购买FRP服务，服务器安装frp软件后，可以通过网页配置隧道如下图，可以使用香港的服务器省去域名的备案，但不太适合云盘等大流量应用。 方案二：DDNS 内网穿透需要付费，并且有带宽和流量限制，额外的一个中转服务器也会影响访问速度。 好在ipv6已经逐渐普及，若服务端和客户端同时支持ipv6网络，
前端表单开发经验
前言 表单是前端开发中常见的场景，注册登录、调查问卷，乃至租赁一个云服务器都是在填写表单。 本文根据我的表单开发经验分享表单开发中，为什么需要表单库进行辅助。 原生表单 前端技术上，表单对应form标签，MDN有详细的介绍。 以一个注册表单为例，我们需要如下标签 这离用户体验还很远，想要完善它的功能，都要依靠JS，原生表单有很多能力缺口，例如： 1. 无法展示错误信息 为了告知用户错误的原因，常见在输入框底部进行红色文案的提示，如下图。HTML会给校验失败的元素添加CSS 伪类 :invalid，但这还远远不够。 2. 不支持自定义校验 内置支持require、pattern正则这些能力，但确认密码的校验需要和第一次填写的密码进行对比，没有相关的属性可以用。 React中的表单 尝试在React下实现一个完整的注册表单。 我们维护了两个状态对象，一个formValue代表表单值，一个error用于渲染错误信息。每一个input输入框传入value与onChange使其受控，用户输入后会修改formValue并进行校验。同时提交时也会重新进行校验，满足条
在海淀送送外卖
您好，外卖放门口了
职业起源 - 我维护的第一款产品
我大学只专注了两件事，一个是CS，另一个也是CS
最小应用实践 - Valorant桌面小部件开发
需求背景 Valorant是拳头的新FPS游戏，皮肤商店每天只刷新4件商品，因此如果想要买到想要的皮肤需要每日登录帐号查看。有些第三方网站可以填写帐号密码查看，除了信任危机，也有社区传闻单IP频繁登录有可能造成帐号封禁，每天都去查看也很恼人。 小调研 iOS16后开放了桌面小部件的接口，Scriptable支持通过代码开发小部件，我也曾做过简单的小部件 在Github冲浪了一下，找到了拳头登录的接口、Valorant游戏数据的接口以及相关的图片等静态资源 开发背景 2021年底我就实现了这样的功能。能用，但不好用。 1. 很慢而且容易出错脚本请求了近十个境外的接口，仅完成登录就需要请求三次拳头的接口，作为后台刷新的程序，普通用户的网络条件下常出现错误。 2. 展示不够美观Scriptable 提供的方法不足以简单的绘制好看的界面，也不支持自适应布局。无论是Stack(容器)还是Text (文字) 都需要手动指定尺寸，不同屏幕下的组件宽高比不同，想完美绘制界面，需要为每一个不同的屏幕尺寸设定不同的大小，尽管社区存在这样的对应关系 但这仍不是好的解法。 改进 2
我的第一个开源工具 inkrss
inkrss是什么 inkrss是一个开源的工具，借助cloudflare免费的服务，实现了对RSS信息的主动获取 为什么做这个 有这个想法是在Telegram看到一些机器人，例如flowerss-bot。 学生阶段没有付费能力，我部署的许多服务都使用了CloudFlare Workers（一种Serverless服务），所以当cloudflare推出Cron Triggers（定时触发能力）与Workers KV（数据存储能力）时，就想到了开发这样一个服务。 有些小难点 1. Workers KV限制每天写次数为1000，对比运行在Node上的程序，无服务器函数无法维护状态，强依赖数据存储。 2. Workers限制单次运行http请求的次数，请求订阅源的次数受限。 3. Workers限制单次CPU运行时间为10ms，无法做复杂的解析，如解析RSS订阅源XML格式的数据。 方案 流程上，用户输入RSS源的地址进行订阅，数据库中维护这样一个订阅源的数组。定时服务每分钟去查看订阅源是否更新，如果更新则通知给用户。 随机访问 用户可能订阅几十个信息源，但受
抓包工具应用实践
浏览器、windows、ios端的抓包流程，使用fiddler和surge。