A4纸打印

Yunfeng Teng - Senior Front-End Developer

Phone/Wechat: 137-6155-6817
Born: 
Year 1991
Location: 
Shanghai Pudong, China
Education: 
Bachelor of Pharmacy, Shenyang Pharmaceutical University
Front-End (8 years). Team/skill management (5 years). Vue (4 years). React (3 years). BIM (2 years). Fintech (funds, insurances, 5 years).
Rich experience in hybrid APP development, performance optimization, canvas interaction, and Wechat development.
Gain special award for talents in key industrial fields from The Shanghai Municipal Finance Bureau.
Work Experience* QA experience in pharmaceutical firm less than 3 months in year 2013 is omitted
  • Front-End Team Leader
     @ Pinlan
    Building Information Model
    2 years
    • * Product: AlphaDraw is like online CAD, available to recognize .dwg files and edit online.
    • * Build frontend team from zero. Reduce frontend bugs to 10% from 30%.
    • * Design code to reduce complexity in core pages. Lead development of template project.
  • Senior Front-End Developer
     @ DDL
    Listed company
    Number of staff: 2k
    0.5 year
    • * Webpack4 optimization,HMR: 16s => 1s,build: 360s => 72s,size: 90.2M => 22.3M.
  • Senior Front-End Developer
     @ HowBuy
    Funds
    Listed company
    Hybrid APP
    Number of staff: 1.5k
    3 years
    • * Responsible for core transactions pages in hybrid APPs.
    • * Play leading role in improving team level of technique.
    • * Optimize for compiling (400+ pages, 60min to 15min), reduce output package size.
  • Junior Front-End Developer
     @ Tianli
    Car insurances
    Listed company
    Wechat
    3 years
  • Regular Affairs  @ Zhejiang Apeloa Kangyu
    Listed company
    Top 40 in pharmacy industry
    Number of staff: 6k
    2 years
    • * Right-hand man. Use English as main working language.
My Works
  • Online editor for 2D/3D model
    fabric.js
    three.js
    Node+MySQL
  • Online logs management system
    Node(Koa)
    MySQL(Sequelize)
    Payment
  • Github projects
    • * jmock: command line tool used to mock data and proxy requests.
    • * html5-cli: command line tool used to provide live reload ability to normal projects.
    • * better-monitor: JS SDK used to intercept AJAX requests, report JS runtime error logs.
    • * utils-daily: JS lib containing utility functions, supporting TS, using Jest for unit test.
    • * memo: E-book on frontend, in the form of PDF, web app, Android and Windows client.
    • * IdeaPress: Content management system, developed using Nuxt.js and MySQL.

滕运锋的前端简历

手机/微信:137-6155-6817
出生/坐标:
1991年,浦东周浦
学历:
沈阳药科大学(全日制一本),药学专业
8年前端(5年团队管理/技术带队,4年Vue,3年React),其中2年建筑模型BIM经验、5年互联网金融(基金销售、车险比价)经验。在混合APP开发、性能优化、Canvas交互和微信公众号开发上有较深积累。重视工程化,喜欢写脚本,经常阅读英文技术书籍和浏览GitHub。在个人项目中为Node全栈偏前端角色。自学能力强,读书时有跳级、保送经历。上海市重点产业领域人才专项奖励获得者。
工作/项目经历*刚毕业时有一份药企QA工作未列,因与前端无关且工作时间小于3个月
  • 前端 Team Leader
    @上海**数据
    建筑模型 BIM
    高新企业
    2
    • * 产品:在线的建筑dwg图纸识别、Canvas协同编辑(绘制墙、门、窗、柱、楼梯等)、下载。
    • * 从 0 到 1 搭建前端团队。将研发 bug 中前端 bug 占比从 30% 优化至 10%。
    • * 优化代码设计方式,降低开发核心页面的心智负担。组织基础项目模板的开发等。
  • 资深前端
    @叮咚*菜
    供应链管理
    上市公司
    高新企业
    2000人
    0.5 年
    • * Webpack4优化,热更新:16s => 1s,build:360s => 72s,build产物:90.2M => 22.3M。
  • 高级前端(技术带队)
    @好买*富
    基金销售
    上市公司
    高新企业
    1500人
    混合APP
    3 年
    • * 主要负责核心产品"好买基金" 混合 APP 内交易类页面的业务迭代,处理大部分产线问题。
    • * 在团队内起到技术带队的作用,制定团队代码规范,普及代码最佳实践,提高团队编码能力。
    • * 优化编译时间(400+页面,60min => 15min),减少 APP 中全量/增量 H5 资源包的大小。
  • 前端主程
    @北京无线*利上海分公司
    车险比价
    上市公司
    微信公众号
    3 年
  • 国际药品注册 @浙江普洛*裕制药
    上市公司
    医药工业企业40强
    6000人
    2 年
    • * 团队得力干将,以英语作为主要书面工作语言。
个人作品
  • 2D/3D模型在线编辑
    fabric.js
    three.js
    Node+MySQL
    二维俯视图+属性=>三维
  • 日志查看系统
    Node(Koa)
    MySQL(Sequelize)
    微信支付
    会员
    • * jmock:命令行工具,方便mock数据、转发请求。
    • * html5-cli:创建移动端项目(对不使用Vite、Webpack等构建工具的项目,支持live reload)。
    • * better-monitor:客户端SDK,支持拦截AJAX请求、上报JS运行时错误等。已集成在线服务。
    • * utils-daily:前端开发常用函数库,支持TypeScript,使用Jest作单元测试。
    • * 前端电子书:支持暗黑模式,提供PDF、Web APP, 安卓/Windows客户端等形式。
    • * IdeaPress:基于Nuxt.js和MySQL搭建的CMS内容管理系统。
投递简历部分已结束,打印当前简历只需打印前面内容。后续页面无需打印。
第1页
项目经历:筑绘通(在线建筑模型编辑)
2021年12月~2024年1月
  • 这是一个集dwg建筑模型识别、编辑、出图功能为一体的在线工具。项目难点在于数据模型种类繁多、异步事件处理频繁、充斥着三级以上的联动交互,很容易出bug,在组员的支持下,第一年我们就成功将前端团队的bug占比下调了20个百分点。
    2年时间里,我们主要做了以下事情:
    • * 将项目由Vue2 option API + js重构为Vue3 composition API + ts,数据类型更清晰。
    • * 制定代码规范,坚持code review,增强团队成员对代码的敬畏之心。
    • * 整理对外定制项目中的常见UI元素,带领组员开发了一套基础项目模板,方便开展新项目。
    • * 工作台代码组织优化:①将画布相关API和对象模型单独封装成SDK,从业务代码中抽离。②按需绑定/移除/恢复事件监听。③对对象上不需要立即获取的数据进行lazy读取优化。
第2页
项目经历:叮咚买菜供应链后台系统
2021年7月~2021年12月
  • 这是一个使用Vue2 + Element-UI + Webpack4的典型供应链后台管理系统。我主要负责调拨部分的业务迭代。彼时团队正用乾坤将老应用拆分微前端,但老项目短时间内仍将存在。老项目开发和编译用时长,严重影响了开发/部署效率。故对老项目进行了编译优化。
    本次优化前后核心数据对比结果见上图,其中最有意义的数据是以下3个:
    • * dev热更新时间:从16秒降至不到1秒,降幅超93%,显著提升了开发效率。
    • * build时间:从近6分钟降至1分12秒,降幅超79%,提高了测试/产线环境的发布效率。
    • * build产物大小:从90.2MB降至22.3MB,降幅超75%,提升了用户体验(开启gzip后仅4MB)。
    主要的优化点有:
    • * 减少无意义的资源引用(效果拔群⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐)
    • * 合理设置webpackMode(效果拔群⭐⭐⭐⭐⭐⭐)
    • * 升级部分插件(效果一般⭐⭐⭐)
    • * 升级node(效果不定⭐⭐)
    • * devtool的值注意一下(效果一般⭐⭐⭐)
    • * 使用CDN、DLL(效果一般⭐)
    • * 更换压缩插件(效果较好⭐⭐⭐⭐)
    • * 干掉SourceMap(效果好⭐⭐⭐⭐⭐)
    • * 提取公共代码(效果好⭐⭐⭐⭐⭐)
    • * 使用缓存(效果一般⭐)
第3页
项目经历:好买基金+储蓄罐(2个APP)
2018年9月~2021年7月
  • 这是hybrid APP,由原生和前端团队公共维护,前端团队负责其中的web部分,web部分按访问协议分为2类:
    • * 远程通过https://协议访问的web页面:发布简单、访问慢
    • * 打包到APP本地通过file://协议访问的web资源包:发布麻烦(涉及增量/全量包概念)、访问快
    在职期间,对项目进行了一系列技术优化,比较突出的点有:
    • * 减少APP内H5资源包的全量包和增量包大小,其中一个子项目优化后编译产物大小缩减了78%(4.6M=>1M),编译时间缩减了87%(150秒=>20秒)
    • * 对于1个项目里输出产物需要同时用于多处(掌机APP、储蓄罐APP、微信/wap端)但每处又不完全一致的情况,支持根据路由配置(示意图见下页附图2)实现编译一次按模块/页面精度输出多份不同产物,避免需要编译多次的麻烦。
    • * 通过条件编译的方式,将编译最慢的一个大型webpack项目(400多页面)的编译时间由一个多小时缩短到一刻钟以内
    此外,对项目架构也进行了一系列优化(优化前后H5资源架构对比图见下页附图1):
    • * 将仓库B代码合并至仓库A的cxg子项目中,去掉了对仓库B的代码维护工作。
    • * 对仓库A中asset子项目和cxg子项目将中部分通过不使用webpack的上古项目代码进行迁移,统一使用webpack打包,开发体验趋于一致。
    • * 在仓库A中新增vendor子项目,编译出的js供其他3个子项目复用,有效减少了冗余代码。
    • * 将低频使用页面,从APP端本地web资源中挪到远程web资源中。
第4页
项目经历:好买基金+储蓄罐(2个APP)
2018年9月~2021年7月
  • 附图1:项目架构优化前后H5资源架构对比图
    附图2:前端项目独立模块打包示意图
第5页
个人作品:在线bug监控系统
  • 实用的bug监控平台,平时公司项目里就可以用(尚未做读写分离,不适用于用户量大的场景)。包含以下子项目:
    • * PC端管理系统。
    • * 日志上报JS SDK(供外部项目集成上报功能)。
    • * SSR预渲染的首页/着陆页(方便SEO)。
    • * 登录模块。
    • * node接口服务(koa + mysql)。
    系统简介:
    • * 支持上报JS运行时错误日志、接口日志、行为日志等。
    • * 支持统计PV、UV、浏览器信息等。
    • * 支持按用户、项目维度来隔离日志,方便阅读日志。
    • * 该系统自带角色区分、会员有效期管理、在线支付、订单管理、邮箱验证、定时任务等功能。可作为开发常规网站的模板
第6页
个人作品:在线bug监控系统
  • 附图1:Bug管理
    附图2:行为日志在线查看
第7页
个人作品:二维/三维在线编辑器
  • 二维部分基于fabric.js实现。三维部分基于three.js实现。
    • * 二维工作台中,在简单平面图形的基础上,赋予其三维属性。
    • * 二维工作台支持展示和编辑操作。
    • * 三维工作台是对二维工作台中对象根据其属性进行的立体化展示。
    • * 三维工作台目前仅支持展示,不支持编辑。
第8页
个人作品:博客