Hu.
前端开发工程师
海尔生物医疗 · 3年经验
日薪：
￥600/8h
地点：
北京 海淀
时间：
下班后周六周日
信用行为
0
接单数
0
评价数
0
收藏数
技术能力
一、主流框架
Vue3 技术栈：熟练运用 Composition API 组织复杂组件逻辑，掌握 <script setup> + TypeScript 开发模式，能通过 Pinia 实现中大型项目的状态管理（如模块拆分、持久化），理解响应式原理（Proxy 基本工作机制）。
框架通用能力：能基于框架封装可复用组件库（含 props 类型定义、事件通信），解决实际开发中的性能问题。
TypeScript 实用技能
类型系统：掌握接口（interface）、泛型、联合类型等常用特性，能为业务数据（如表单、接口返回值）定义清晰类型，避免 any 滥用。
工程配置：能根据项目需求调整 tsconfig.json（如模块解析、编译目标），结合 ESLint 实现类型校验与代码规范联动。
二、工程化与开发效率
构建与部署工具
构建配置：熟练使用 Vite 或 Webpack 进行项目构建，能配置环境变量、处理静态资源、实现代码分割（Code Splitting），通过 Tree-Shaking 减小包体积。
项目协作规范
代码管理：熟练使用 Git 进行分支管理，能处理代码冲突，通过 Commitlint 规范提交信息。
质量保障：搭建 Jest 单元测试框架，为核心工具函数、组件编写测试用例（覆盖率 50%+），使用 ESLint + Prettier 统一代码风格。
三、性能优化与用户体验
前端性能优化
加载优化：能通过路由懒加载、图片懒加载（IntersectionObserver）、合理使用缓存（HTTP 缓存、localStorage）提升首屏加载速度。
渲染优化：理解浏览器回流 / 重绘机制，能优化频繁更新的 DOM 操作（如使用 DocumentFragment），对长列表场景应用虚拟滚动（如 vue-virtual-scroller）。
接口优化：通过 Axios 拦截器统一处理请求 / 响应，实现接口缓存、错误重试，能配合后端做数据分页、按需加载。
用户体验提升
交互设计：能实现符合直觉的交互逻辑（如表单验证实时反馈、加载状态动效），兼容不同屏幕尺寸（响应式布局）。
可访问性基础：了解 ARIA 标签用法，确保表单、按钮等元素支持键盘导航，适配主流浏览器（Chrome、Safa
Vue3 技术栈：熟练运用 Composition API 组织复杂组件逻辑，掌握 <script setup> + TypeScript 开发模式，能通过 Pinia 实现中大型项目的状态管理（如模块拆分、持久化），理解响应式原理（Proxy 基本工作机制）。
框架通用能力：能基于框架封装可复用组件库（含 props 类型定义、事件通信），解决实际开发中的性能问题。
TypeScript 实用技能
类型系统：掌握接口（interface）、泛型、联合类型等常用特性，能为业务数据（如表单、接口返回值）定义清晰类型，避免 any 滥用。
工程配置：能根据项目需求调整 tsconfig.json（如模块解析、编译目标），结合 ESLint 实现类型校验与代码规范联动。
二、工程化与开发效率
构建与部署工具
构建配置：熟练使用 Vite 或 Webpack 进行项目构建，能配置环境变量、处理静态资源、实现代码分割（Code Splitting），通过 Tree-Shaking 减小包体积。
项目协作规范
代码管理：熟练使用 Git 进行分支管理，能处理代码冲突，通过 Commitlint 规范提交信息。
质量保障：搭建 Jest 单元测试框架，为核心工具函数、组件编写测试用例（覆盖率 50%+），使用 ESLint + Prettier 统一代码风格。
三、性能优化与用户体验
前端性能优化
加载优化：能通过路由懒加载、图片懒加载（IntersectionObserver）、合理使用缓存（HTTP 缓存、localStorage）提升首屏加载速度。
渲染优化：理解浏览器回流 / 重绘机制，能优化频繁更新的 DOM 操作（如使用 DocumentFragment），对长列表场景应用虚拟滚动（如 vue-virtual-scroller）。
接口优化：通过 Axios 拦截器统一处理请求 / 响应，实现接口缓存、错误重试，能配合后端做数据分页、按需加载。
用户体验提升
交互设计：能实现符合直觉的交互逻辑（如表单验证实时反馈、加载状态动效），兼容不同屏幕尺寸（响应式布局）。
可访问性基础：了解 ARIA 标签用法，确保表单、按钮等元素支持键盘导航，适配主流浏览器（Chrome、Safa
项目经验
样本库管理系统
项目介绍：
该系统是为海尔生物医疗样本库打造的综合性管理平台，旨在实现样本从采集、录入、
存储到查询、调用等全流程的规范化管理，满足样本库日常运营和科研工作的需求，提升样
本管理的效率和准确性。
技术栈：vue2全家桶、Bootstrap、Webpack、Element UI等。
工作内容：
1. 核心功能模块实现
o 样本入库模块：开发支持批量导入（Excel 模板解析）、扫码录入（集成 zxing-js）、手动录入三种方式
的录入系统，通过自定义表单校验规则（基于 async-validator）实现样本类型、采集时间等 20 + 字段
的实时校验，错误提示准确率达 99%。
o 存储管理模块：开发三维冷库可视化界面（基于 Canvas 绘制冷库立体结构），实现样本存储位置的拖拽
式分配、冲突检测（通过坐标计算判断位置占用），并联动温度传感器数据展示实时存储环境，操作效率
提升 50%。
2. 性能与体验优化
o 针对样本查询（支持多条件组合筛选）场景，实现「前端预筛选 + 后端精准查询」混合方案：本地缓存近
30 天热门查询结果，通过 lodash 防抖（500ms）合并频繁请求，查询响应速度从 1.2s 降至 300ms。
o 优化大数据列表渲染：采用 vue-virtual-scroller 实现万级样本列表虚拟滚动，只渲染可视区域 DOM，
页面内存占用减少 70%，解决滚动卡顿问题。 难点：
难点 1：样本数据结构复杂（含 100 + 字段，多表关联），表单录入易出错且操作繁琐。
解决：设计「动态表单配置系统」，通过 JSON 配置定义表单字段、校验规则和联动逻辑（如选择 "血液
样本" 后自动显示 "血型" 字段），支持用户自定义模板，录入效率提升 60%。
难点 2：多用户同时操作时易出现数据冲突（如同时修改同一样本信息）。
解决：实现基于 WebSocket 的实时数据监听，当检测到数据冲突时，通过 vuex 触发全局提示，并展示
冲突数据对比界面，支持手动合并，冲突率降低至 0.3%。
医家医云慢病管理平台 3.0
项目介绍：
医家医云慢病管理平台 3.0 是公司自研的管理平台。该平台在北京、河南、山西等多个省份帮助各级医院在
慢 性病的管理方面取得重大突破 ，在慢性病领域有着显著的成就。慢病管理平台还针对不同地区做出了定制课
题、定 制随访、使医生可以做到精准管理慢性病患者执行对应方案 ，监控患者身体状况 ，定时提醒随访等。 技术栈：vue3、 Pinia、Vue Router、 Element Plus、 Echarts 等。 工作内容：
1. 负责项目从 0-1 的框架搭建 ，调研方案可行性 ，负责技术选型 ，难点攻克。
2. 对于种类多且易修改的产品形态 ，实现通过 JSON 文件配置减少修改页面的频率和实现快速开发。
3. 负责通用业务组件封装（包括弹框、导航、表格、时间线、 Echarts 等 10+业务组件） ，拉通 ui 部门 ，
统 一前端标准化 ，利用 hooks 将公用逻辑抽取 ，保障复用性和扩展性。60%需求工时由4h 降低到 1h。
4. 二次封装 axios ，在这个基础上还做了相应错误请求的处理（404,500） ，包括 loading 动画。 难点：
1. 封装大文件切片上传 ，断点续传组件 ，提高上传速度优化体验。
2. 使用图片压缩脚本结合 webpack 打包，帮助项目提高打包图片压缩质量，与效率，总压缩图片数量 800+。 成果展示：
成功在多个项目推行公共组件 ，极大节省人力成本 ，支持跨域与后台交互 ，实现项目解绑 ，可以动态发布。
成功在多家医院部署该项目 ， 目前累计患者已达 100w+。
项目介绍：
该系统是为海尔生物医疗样本库打造的综合性管理平台，旨在实现样本从采集、录入、
存储到查询、调用等全流程的规范化管理，满足样本库日常运营和科研工作的需求，提升样
本管理的效率和准确性。
技术栈：vue2全家桶、Bootstrap、Webpack、Element UI等。
工作内容：
1. 核心功能模块实现
o 样本入库模块：开发支持批量导入（Excel 模板解析）、扫码录入（集成 zxing-js）、手动录入三种方式
的录入系统，通过自定义表单校验规则（基于 async-validator）实现样本类型、采集时间等 20 + 字段
的实时校验，错误提示准确率达 99%。
o 存储管理模块：开发三维冷库可视化界面（基于 Canvas 绘制冷库立体结构），实现样本存储位置的拖拽
式分配、冲突检测（通过坐标计算判断位置占用），并联动温度传感器数据展示实时存储环境，操作效率
提升 50%。
2. 性能与体验优化
o 针对样本查询（支持多条件组合筛选）场景，实现「前端预筛选 + 后端精准查询」混合方案：本地缓存近
30 天热门查询结果，通过 lodash 防抖（500ms）合并频繁请求，查询响应速度从 1.2s 降至 300ms。
o 优化大数据列表渲染：采用 vue-virtual-scroller 实现万级样本列表虚拟滚动，只渲染可视区域 DOM，
页面内存占用减少 70%，解决滚动卡顿问题。 难点：
难点 1：样本数据结构复杂（含 100 + 字段，多表关联），表单录入易出错且操作繁琐。
解决：设计「动态表单配置系统」，通过 JSON 配置定义表单字段、校验规则和联动逻辑（如选择 "血液
样本" 后自动显示 "血型" 字段），支持用户自定义模板，录入效率提升 60%。
难点 2：多用户同时操作时易出现数据冲突（如同时修改同一样本信息）。
解决：实现基于 WebSocket 的实时数据监听，当检测到数据冲突时，通过 vuex 触发全局提示，并展示
冲突数据对比界面，支持手动合并，冲突率降低至 0.3%。
医家医云慢病管理平台 3.0
项目介绍：
医家医云慢病管理平台 3.0 是公司自研的管理平台。该平台在北京、河南、山西等多个省份帮助各级医院在
慢 性病的管理方面取得重大突破 ，在慢性病领域有着显著的成就。慢病管理平台还针对不同地区做出了定制课
题、定 制随访、使医生可以做到精准管理慢性病患者执行对应方案 ，监控患者身体状况 ，定时提醒随访等。 技术栈：vue3、 Pinia、Vue Router、 Element Plus、 Echarts 等。 工作内容：
1. 负责项目从 0-1 的框架搭建 ，调研方案可行性 ，负责技术选型 ，难点攻克。
2. 对于种类多且易修改的产品形态 ，实现通过 JSON 文件配置减少修改页面的频率和实现快速开发。
3. 负责通用业务组件封装（包括弹框、导航、表格、时间线、 Echarts 等 10+业务组件） ，拉通 ui 部门 ，
统 一前端标准化 ，利用 hooks 将公用逻辑抽取 ，保障复用性和扩展性。60%需求工时由4h 降低到 1h。
4. 二次封装 axios ，在这个基础上还做了相应错误请求的处理（404,500） ，包括 loading 动画。 难点：
1. 封装大文件切片上传 ，断点续传组件 ，提高上传速度优化体验。
2. 使用图片压缩脚本结合 webpack 打包，帮助项目提高打包图片压缩质量，与效率，总压缩图片数量 800+。 成果展示：
成功在多个项目推行公共组件 ，极大节省人力成本 ，支持跨域与后台交互 ，实现项目解绑 ，可以动态发布。
成功在多家医院部署该项目 ， 目前累计患者已达 100w+。
案例展示 全部案例 >
Hu.
前端开发工程师 · 3年经验 · 海尔生物医疗
0
累计接单
0
用户评价
0
被收藏
信用行为
0
接单数
0
评价数
0
收藏数
技术能力
一、主流框架
Vue3 技术栈：熟练运用 Composition API 组织复杂组件逻辑，掌握 <script setup> + TypeScript 开发模式，能通过 Pinia 实现中大型项目的状态管理（如模块拆分、持久化），理解响应式原理（Proxy 基本工作机制）。
框架通用能力：能基于框架封装可复用组件库（含 props 类型定义、事件通信），解决实际开发中的性能问题。
TypeScript 实用技能
类型系统：掌握接口（interface）、泛型、联合类型等常用特性，能为业务数据（如表单、接口返回值）定义清晰类型，避免 any 滥用。
工程配置：能根据项目需求调整 tsconfig.json（如模块解析、编译目标），结合 ESLint 实现类型校验与代码规范联动。
二、工程化与开发效率
构建与部署工具
构建配置：熟练使用 Vite 或 Webpack 进行项目构建，能配置环境变量、处理静态资源、实现代码分割（Code Splitting），通过 Tree-Shaking 减小包体积。
项目协作规范
代码管理：熟练使用 Git 进行分支管理，能处理代码冲突，通过 Commitlint 规范提交信息。
质量保障：搭建 Jest 单元测试框架，为核心工具函数、组件编写测试用例（覆盖率 50%+），使用 ESLint + Prettier 统一代码风格。
三、性能优化与用户体验
前端性能优化
加载优化：能通过路由懒加载、图片懒加载（IntersectionObserver）、合理使用缓存（HTTP 缓存、localStorage）提升首屏加载速度。
渲染优化：理解浏览器回流 / 重绘机制，能优化频繁更新的 DOM 操作（如使用 DocumentFragment），对长列表场景应用虚拟滚动（如 vue-virtual-scroller）。
接口优化：通过 Axios 拦截器统一处理请求 / 响应，实现接口缓存、错误重试，能配合后端做数据分页、按需加载。
用户体验提升
交互设计：能实现符合直觉的交互逻辑（如表单验证实时反馈、加载状态动效），兼容不同屏幕尺寸（响应式布局）。
可访问性基础：了解 ARIA 标签用法，确保表单、按钮等元素支持键盘导航，适配主流浏览器（Chrome、Safa
Vue3 技术栈：熟练运用 Composition API 组织复杂组件逻辑，掌握 <script setup> + TypeScript 开发模式，能通过 Pinia 实现中大型项目的状态管理（如模块拆分、持久化），理解响应式原理（Proxy 基本工作机制）。
框架通用能力：能基于框架封装可复用组件库（含 props 类型定义、事件通信），解决实际开发中的性能问题。
TypeScript 实用技能
类型系统：掌握接口（interface）、泛型、联合类型等常用特性，能为业务数据（如表单、接口返回值）定义清晰类型，避免 any 滥用。
工程配置：能根据项目需求调整 tsconfig.json（如模块解析、编译目标），结合 ESLint 实现类型校验与代码规范联动。
二、工程化与开发效率
构建与部署工具
构建配置：熟练使用 Vite 或 Webpack 进行项目构建，能配置环境变量、处理静态资源、实现代码分割（Code Splitting），通过 Tree-Shaking 减小包体积。
项目协作规范
代码管理：熟练使用 Git 进行分支管理，能处理代码冲突，通过 Commitlint 规范提交信息。
质量保障：搭建 Jest 单元测试框架，为核心工具函数、组件编写测试用例（覆盖率 50%+），使用 ESLint + Prettier 统一代码风格。
三、性能优化与用户体验
前端性能优化
加载优化：能通过路由懒加载、图片懒加载（IntersectionObserver）、合理使用缓存（HTTP 缓存、localStorage）提升首屏加载速度。
渲染优化：理解浏览器回流 / 重绘机制，能优化频繁更新的 DOM 操作（如使用 DocumentFragment），对长列表场景应用虚拟滚动（如 vue-virtual-scroller）。
接口优化：通过 Axios 拦截器统一处理请求 / 响应，实现接口缓存、错误重试，能配合后端做数据分页、按需加载。
用户体验提升
交互设计：能实现符合直觉的交互逻辑（如表单验证实时反馈、加载状态动效），兼容不同屏幕尺寸（响应式布局）。
可访问性基础：了解 ARIA 标签用法，确保表单、按钮等元素支持键盘导航，适配主流浏览器（Chrome、Safa
项目经验
样本库管理系统
项目介绍：
该系统是为海尔生物医疗样本库打造的综合性管理平台，旨在实现样本从采集、录入、
存储到查询、调用等全流程的规范化管理，满足样本库日常运营和科研工作的需求，提升样
本管理的效率和准确性。
技术栈：vue2全家桶、Bootstrap、Webpack、Element UI等。
工作内容：
1. 核心功能模块实现
o 样本入库模块：开发支持批量导入（Excel 模板解析）、扫码录入（集成 zxing-js）、手动录入三种方式
的录入系统，通过自定义表单校验规则（基于 async-validator）实现样本类型、采集时间等 20 + 字段
的实时校验，错误提示准确率达 99%。
o 存储管理模块：开发三维冷库可视化界面（基于 Canvas 绘制冷库立体结构），实现样本存储位置的拖拽
式分配、冲突检测（通过坐标计算判断位置占用），并联动温度传感器数据展示实时存储环境，操作效率
提升 50%。
2. 性能与体验优化
o 针对样本查询（支持多条件组合筛选）场景，实现「前端预筛选 + 后端精准查询」混合方案：本地缓存近
30 天热门查询结果，通过 lodash 防抖（500ms）合并频繁请求，查询响应速度从 1.2s 降至 300ms。
o 优化大数据列表渲染：采用 vue-virtual-scroller 实现万级样本列表虚拟滚动，只渲染可视区域 DOM，
页面内存占用减少 70%，解决滚动卡顿问题。 难点：
难点 1：样本数据结构复杂（含 100 + 字段，多表关联），表单录入易出错且操作繁琐。
解决：设计「动态表单配置系统」，通过 JSON 配置定义表单字段、校验规则和联动逻辑（如选择 "血液
样本" 后自动显示 "血型" 字段），支持用户自定义模板，录入效率提升 60%。
难点 2：多用户同时操作时易出现数据冲突（如同时修改同一样本信息）。
解决：实现基于 WebSocket 的实时数据监听，当检测到数据冲突时，通过 vuex 触发全局提示，并展示
冲突数据对比界面，支持手动合并，冲突率降低至 0.3%。
医家医云慢病管理平台 3.0
项目介绍：
医家医云慢病管理平台 3.0 是公司自研的管理平台。该平台在北京、河南、山西等多个省份帮助各级医院在
慢 性病的管理方面取得重大突破 ，在慢性病领域有着显著的成就。慢病管理平台还针对不同地区做出了定制课
题、定 制随访、使医生可以做到精准管理慢性病患者执行对应方案 ，监控患者身体状况 ，定时提醒随访等。 技术栈：vue3、 Pinia、Vue Router、 Element Plus、 Echarts 等。 工作内容：
1. 负责项目从 0-1 的框架搭建 ，调研方案可行性 ，负责技术选型 ，难点攻克。
2. 对于种类多且易修改的产品形态 ，实现通过 JSON 文件配置减少修改页面的频率和实现快速开发。
3. 负责通用业务组件封装（包括弹框、导航、表格、时间线、 Echarts 等 10+业务组件） ，拉通 ui 部门 ，
统 一前端标准化 ，利用 hooks 将公用逻辑抽取 ，保障复用性和扩展性。60%需求工时由4h 降低到 1h。
4. 二次封装 axios ，在这个基础上还做了相应错误请求的处理（404,500） ，包括 loading 动画。 难点：
1. 封装大文件切片上传 ，断点续传组件 ，提高上传速度优化体验。
2. 使用图片压缩脚本结合 webpack 打包，帮助项目提高打包图片压缩质量，与效率，总压缩图片数量 800+。 成果展示：
成功在多个项目推行公共组件 ，极大节省人力成本 ，支持跨域与后台交互 ，实现项目解绑 ，可以动态发布。
成功在多家医院部署该项目 ， 目前累计患者已达 100w+。
项目介绍：
该系统是为海尔生物医疗样本库打造的综合性管理平台，旨在实现样本从采集、录入、
存储到查询、调用等全流程的规范化管理，满足样本库日常运营和科研工作的需求，提升样
本管理的效率和准确性。
技术栈：vue2全家桶、Bootstrap、Webpack、Element UI等。
工作内容：
1. 核心功能模块实现
o 样本入库模块：开发支持批量导入（Excel 模板解析）、扫码录入（集成 zxing-js）、手动录入三种方式
的录入系统，通过自定义表单校验规则（基于 async-validator）实现样本类型、采集时间等 20 + 字段
的实时校验，错误提示准确率达 99%。
o 存储管理模块：开发三维冷库可视化界面（基于 Canvas 绘制冷库立体结构），实现样本存储位置的拖拽
式分配、冲突检测（通过坐标计算判断位置占用），并联动温度传感器数据展示实时存储环境，操作效率
提升 50%。
2. 性能与体验优化
o 针对样本查询（支持多条件组合筛选）场景，实现「前端预筛选 + 后端精准查询」混合方案：本地缓存近
30 天热门查询结果，通过 lodash 防抖（500ms）合并频繁请求，查询响应速度从 1.2s 降至 300ms。
o 优化大数据列表渲染：采用 vue-virtual-scroller 实现万级样本列表虚拟滚动，只渲染可视区域 DOM，
页面内存占用减少 70%，解决滚动卡顿问题。 难点：
难点 1：样本数据结构复杂（含 100 + 字段，多表关联），表单录入易出错且操作繁琐。
解决：设计「动态表单配置系统」，通过 JSON 配置定义表单字段、校验规则和联动逻辑（如选择 "血液
样本" 后自动显示 "血型" 字段），支持用户自定义模板，录入效率提升 60%。
难点 2：多用户同时操作时易出现数据冲突（如同时修改同一样本信息）。
解决：实现基于 WebSocket 的实时数据监听，当检测到数据冲突时，通过 vuex 触发全局提示，并展示
冲突数据对比界面，支持手动合并，冲突率降低至 0.3%。
医家医云慢病管理平台 3.0
项目介绍：
医家医云慢病管理平台 3.0 是公司自研的管理平台。该平台在北京、河南、山西等多个省份帮助各级医院在
慢 性病的管理方面取得重大突破 ，在慢性病领域有着显著的成就。慢病管理平台还针对不同地区做出了定制课
题、定 制随访、使医生可以做到精准管理慢性病患者执行对应方案 ，监控患者身体状况 ，定时提醒随访等。 技术栈：vue3、 Pinia、Vue Router、 Element Plus、 Echarts 等。 工作内容：
1. 负责项目从 0-1 的框架搭建 ，调研方案可行性 ，负责技术选型 ，难点攻克。
2. 对于种类多且易修改的产品形态 ，实现通过 JSON 文件配置减少修改页面的频率和实现快速开发。
3. 负责通用业务组件封装（包括弹框、导航、表格、时间线、 Echarts 等 10+业务组件） ，拉通 ui 部门 ，
统 一前端标准化 ，利用 hooks 将公用逻辑抽取 ，保障复用性和扩展性。60%需求工时由4h 降低到 1h。
4. 二次封装 axios ，在这个基础上还做了相应错误请求的处理（404,500） ，包括 loading 动画。 难点：
1. 封装大文件切片上传 ，断点续传组件 ，提高上传速度优化体验。
2. 使用图片压缩脚本结合 webpack 打包，帮助项目提高打包图片压缩质量，与效率，总压缩图片数量 800+。 成果展示：
成功在多个项目推行公共组件 ，极大节省人力成本 ，支持跨域与后台交互 ，实现项目解绑 ，可以动态发布。
成功在多家医院部署该项目 ， 目前累计患者已达 100w+。
案例展示
数智化慢病大数据监控管理平台
一、项目背景 随着社会发展与人口老龄化加剧，慢性病已成为全球公共卫生领域的重大挑战。在我国，高血压、糖尿病、高血脂等慢性病发病率逐年攀升，不仅严重影响患者生活质量，也给医疗体系带来沉重负担。传统慢病管理模式存在数据分散、监测滞后、干预不精准等痛点，难以满足日益增长的慢病防控需
简糖小程序
一、项目背景 在糖尿病患者数量持续增长的当下，患者对便捷、高效的健康管理工具需求极为迫切。传统糖尿病管理方式存在诸多不便，如患者难以随时随地获取专业指导，饮食、运动等健康数据记录与分析不够及时精准。简糖小程序正是为打破这些困境而诞生，致力于为糖尿病患者打造全方位、个性化的一站
立即沟通
