范翔宇
Web 前端开发工程师
黑龙江科技大学 网易前端微专业 - 开源项目、产品设计经验
- 负责过多个开源项目，从原型到前后端产品落地：「Web端与移动端的影视下载客户端」和「基于地图和表格筛选的职位爬虫工具」，后者解决了现有社交求职 App 中对于地域概念过于模糊的问题
- 乐于分享
- 在 个人独立博客、SegmentFault 社区和个人公众号中多次分享技术文章和参与技术讨论，在公司任职过程中多次组织技术分享
- 持续保持知识积累，对新技术好奇
- 每周于语雀知识库中编写技术总结，对 CSS Houdini、Serverless、PWA 等新技术持续保持好奇心
- 广州荔支网络技术有限公司（荔枝集团） - 前端开发工程师
- 负责内容线、社交线等业务前端开发工作及其他
- 广州滴普科技有限公司 - 前端开发工程师
- 负责前端项目交付、公司组件库维护、新技术预研、前端分享等工作
- 参与业务脚手架维护，负责 Composition API，TypeScript等接入，应用到了公司十余个项目中，得到了较好的评价
- 成都喜元网络科技有限公司（喜马拉雅）- 前端开发工程师
- 负责喜马拉雅配音平台开发、方案调研、开发脚手架搭建等工作
- 上海易贷网金融信息服务有限公司（成都）- 前端工程师
- 负责 BI 页面制作，数据导出，微信公众号开发，小程序开发，页面制作等工作
- 离职原因：监管原因，平台不能继续运营
- 成都方米科技有限公司 - Web 前端开发工程师
- 负责 页面开发、方案调研、接口调试、性能优化等工作
- 离职原因：个人发展
- 研发效能平台 - 中后台系统 - Vue
- 介绍：该项目是一个敏捷开发管理平台，用于管理软件开发流程中各迭代的开发进度。项目基于 Nuxt.js 与 qiankun 与微前端主应用对接
- 负责 TypeScript 和 Vue Composition API 的接入，保障类型检查和分享接入总结
- 负责开发模块的 Cypress 测试用例编写，保障产品质量并总结使用感受
- 某微信 B2C 商城- Vue
- 介绍：该项目具有上亿交易量，数十万使用用户的微信商城平台。有商城管理系统和微信商城两个部分
- 负责开发、重构项目内子模块代码，对整个代码进行前端性能优化，并分享文章
- 项目进展中微信海报分销裂变玩法，针对客户对海报图片上传效果不满意的问题，做了 Canvas 海报预览方案，得到了客户满意的评价
- 项目后续研发过程中从本地开发打包上线带来的效能问题，研究基于 Gitlab 搭建 CI/CD 相关流程，效率得到提升
- 由于开发人员人员变动频繁，出现了开发代码质量问题，使用代码格式化相关工具（ESLint、husky等）对代码对项目组提交代码进行规范化，并组织 Code Review 保障代码品质
- 负责接入 Sentry 前端监控系统，保障线上环境运行异常及时发现
- 逛街资讯 - 移动端社交资讯服务 - 小程序/Vue
- 介绍：该项目是针对成都地区室内商场导览和资讯的微信公众号和小程序
- 独立负责小程序和公众号的开发。与设计人员配合，完善设计规范和实现公共组件库
- 项目中为解决 Single Page Application 在微信 X5 内核浏览器的各种兼容性问题，总结并分享了相关微信分享问题的解决方案
- 微信小程序基于 Tencent/wepy 项目开发，为 wepy@1 框架开发一个 PostCSS Compiler 并得到了官方仓库 merge
- 故宫阅读 - B2C商城 - Vue/Hybrid App
- 独立负责基于 Cordova 与 Vue.js (Vux) 开发的 Hybrid App 开发，同一份代码兼容微信端版本，实现 write once，runngin on two platforms 的目的
- 对接微信 JS-SDK 与 Android / iOS SDK，完善两端用户体验
- 打包发布测试版本，熟悉 iOS 和 Android 平台相关打包发布配置
- 喜配音 — 喜马拉雅 ToB 端配音平台 - Vue
- 负责对项目 webpack 配置进行优化，提升页面体验，实现部分页面预渲染
- 负责实现一个 HTML5 音频播放器，并在新主播平台公用维护
- 解决后端资源消耗问题，迁移部分需求至前端实现（大文件下载等）
- 【开源项目】基于 Node.js 的个人博客 - egg.js
- 博客和个人首页基于 Node.js 开发，和语雀文档一起用于记录学习资料文档和实验新 Web 特性
- 对于移动端设备和 PC 端设备访问分别使用懒加载(lazyload)和服务端渲染(SSR)方案，保障用户体验和SEO
- 首页基于 PWA 技术实现合理利用 Cache Storage 为保障弱网、断网用户体验
- 基于 HTML5 语义化标签和其他技术方法，探索视障人群无障碍体验
- 持续对项目进行性能优化，lighthouse 评分保持 90 分以上
- 接入 Node.js 性能分析与监控平台，对内存泄漏等不易察觉问题进行及时监控
- 【开源项目】基于 Electron 的影视客户端
- 跨平台（Windows／MacOS／Web）支持，了解 Electron 中 Web 与 Node.js 通信方式
- 响应式布局，同一套代码适配桌面端与移动端
- 基于 SDK 实现批量下载功能，JSSDK 调用迅雷下载软件
- 【开源项目】基于 Node.js 的职位筛选爬虫
- API 来源于客户端和小程序 HTTPS 抓包，了解 Charles 和 Wireshark 等工具的使用
- 使用 MongoDB 的数据存储模型，对数据进行清洗和存储
- 实现一个 Web 界面，可在地图上根据使用者需求对职位进行筛选展示
- 使用 Docker + Jenkins Pipeline 实现自动构建部署，使部署发布更简便