备案 控制台
开发者社区 大淘宝技术 文章 正文

思考、创新、坚持——阿里做了七年前端,我的成长经验分享

简介: 在成长的未知道路上,我们总会遇到各种各样的问题,但是,所有的迷茫与逆境都能够帮助我们成长,我们要抓住每一个机会让自己进步,而不是徘徊不前。淘系前端开发同学——林晚,今天就来和大家分享他这七年的成长经历,以及如何摆脱业务前端的职业迷茫感。

在成长的未知道路上,我们总会遇到各种各样的问题,但是,所有的迷茫与逆境都能够帮助我们成长,我们要抓住每一个机会让自己进步,而不是徘徊不前。

淘系前端开发同学——林晚,今天就来和大家分享他这七年的成长经历,以及如何摆脱业务前端的职业迷茫感。

个人经历

我的经历相对来说比较简单,毕业后一直在阿里。

image.png

07到13年我在武汉大学学习通信工程专业,同时辅修了动画双学位。

13年毕业后加入阿里巴巴国际站,在B2B阶段我对动画和创新交互比较感兴趣,共申请了6项相关专利,有的已经获得授权,赚得了人生的第一桶金:5万 😁

15年转岗到蚂蚁口碑,当时主要负责互动营销和质量检测。

18年了解到淘宝直播,想在多媒体领域持续深耕,最近两年主要负责ALive直播开放和多媒体前端领域的建设。

三个阶段都有一定的成长,也得到了认可。下面就带着大家走进我的七年,希望能给处于迷茫期的你一些指引。

阶段回顾

每个阶段的回顾,按照下面几个阶段来划分,总结了下我在每个阶段的关键词:

  • 折腾点什么(点)
  • 主导点什么(线)
  • 突破点什么(面)
  • 引领点什么(体)

▐ 折腾点什么

初入职场

大家还记得自己做过的第一个需求是什么吗?

image.png

我的第一个需求是做一个类目选择器,索引、排序。我记得当时是周五,我了解完需求和师兄说,这个需求我周末弄两天,下周一就可以做好。当时师兄笑了一下。因为那个时候我还不清楚一个需求的完整流程,需要经过评审、排期、开发、联调、提测最后才能发布。

后来慢慢熟悉了公司里的工作流程,开始闷头做项目,一个接一个,很充实,但平淡。第一个绩效我就拿了3.25,绩效沟通完我给自己写了几个字“知耻而后勇”,我得折腾点什么。

举个栗子

折腾点什么呢?和大家分享个例子:当时喜欢用百度来搜索美女图片,但是列表的浏览体验不太好,于是自己设计实现了一个可以任意方向无限漫游的效果,每一个方向代表一种风格类型,可以实时推荐。大概是这样一个效果:

image.png

大晚上的撸完代码,看到这么多取之不尽的美女挺兴奋。又想能不能跟工作结合起来,于是包装了下概念,申请了一个商品加载和推荐的专利。申请完专利,又想能不能在业务里用起来,于是自己做产品设计,找运营聊场景,最后在俄罗斯的一个采购活动上完成了上线,业务效果List到Detail的转化率比传统的列表形式提升了 3.5倍。

image.png

在国际站一共申请了类似的6项专利,其中一项已经获得国家专利局授权,还有的被法务部推荐去申请了海外专利。

阶段成长和迷茫

国际站,让我完成了从学校到职场的转变。现在回过头看,在国际站我的成长是非常大的,对我的职业发展影响也很大。总结了一下,主要有以下几个方面的成长:

职业性:避免情绪化对工作产生影响;结构化思考和表达
业务和数据思维:养成深入了解业务的习惯,数据化思维看产出和价值
技术结合业务:不为技术而技术,结合业务场景推进技术建设
团队视角:将个人的能力变成团队的能力(比如结合自己在动画方面的经验,在团队里组织了动画兴趣小组、搭建动画平台竹马小站)

在这个阶段,我也产生了一些迷茫,自己折腾的一些事情,和业务场景不太匹配,国际站都是B端的场景,而自己更多的关注在C端的效果和交互,加上集团 all in 无线的大趋势,出现了H5工程师,自己要不要转型?经过考虑后做了一个决定:走向C端,转岗到了当时的创新业务支付宝口碑。

▐ 主导点什么

业务扛把子

在口碑的阶段,自己的职业度更加地成熟,能去主导一些核心的事情了。业务方面成为了扛把子,负责口碑一些核心的频道和栏目的建设,比如大牌抢购、旅游版等;结合之前动画领域的沉淀,团队里动画游戏类的营销活动我也成了一号位。

image.png

如何把业务做好?和大家分享一个大牌抢购的案例。

做业务之前需要充分的理解和思考:

  • 业务的站位是什么?我对口碑C端的业务做了一个分类:围绕“找门店”、“找优惠”、“找内容”这三个维度,对数据进行各种形式和场景化的运营。大牌抢购频道在整个C端业务中的站位,就是针对“找优惠”设计的一个抢购形式的运营场景。
  • 业务的特点是什么?因为有多个场次,场次有多个状态,以及券来源、状态、类型都非常丰富,导致了券的处理复杂度非常高;另外因为是抢购场景,所以对券信息的时效性要求比较高,库存状态和领取状态等信息都需要做到及时更新。
  • 挑战和解法是什么?比如券处理复杂度高很高,我抽象了一个统一的数据结构,这个结构对券的各种维度做了清晰的划分,各种维度交叉组合可以得出很多的种类,为了保证数据结构变动或扩展之后,视图能方便管理,我做了一层展示归一,得出一套展示模式,并且可扩展。

再比如做口碑年度榜单,我也没把它当成一个一次性的动画需求来做,而是通过这个项目沉淀一套动画类需求的标准化处理流程:动画分层、动效拆解、业务解耦、技术实现。为后续的动画类需求提供更高效、更灵活、高复用地处理方案。

技术攻坚

技术方面主导了口碑的真机检测平台砚台,从0-1构建了口碑的真机检测方案。这是一个比较复杂的项目,服务端通过chair应用来实现,在chair应用中又包括socket服务和http服务,socket服务主要负责group分组、agent管理、任务事件处理、数据接收和中转等工作,http服务主要提供页面、接口、数据的处理和读写,数据存储使用的是basement提供的db服务;跟socket服务保持长链接的agent层,负责手机设备的管理,心跳检查,并轮询上报给服务端,还负责命令的接收和下发,数据采集等工作;最后是真机设备,通过adb连接到agent主机。

整个系统比较复杂,自己主导了整个方案的设计并联动客户端完成落地,中间过程也解决了一些关键的技术问题,比如chair如何实现socket服务、进程间如何通信、docker部署多容器socket如何同步等。

阶段成长和迷茫

在口碑经过业务和技术的历练,主要有以下几个方面的成长:

  • 业务主人翁:负责的业务当成自己的孩子来养,每天多体验、每天多思考
  • 做业务更需要技术思维:大牌抢购抽丝剥茧、别有洞天
  • 系统架构和技术攻坚:砚台整体架构、chair应用结合socket服务

在口碑待了3年,我又开始迷茫了:我做的这些事情都是线条的,重点频道、营销业务、真机检测,我后续的发展还是继续沿着这几条线深入吗,再继续做几年,我的变化会有多大?这里其实引申出来的问题是:线条型发展,我的技术领域是什么?

考虑到自己学的是通信工程和数字媒体相关,毕业设计也是做的基于WebRTC的视频会议系统,有一些多媒体的基础,这个领域的壁垒深、空间大,于是想专注于多媒体前端领域发展,转岗到了淘宝直播。

▐ 突破点什么

翻车与逆袭

刚到直播的时候接手的第一个项目是直播间里的亲密度,一个客户端同学写的H5页面,当时在直播间里调试简直苦不堪言,端侧方案其实是很不成熟的。

在日常迭代还能勉强应付,一到大型晚会有很多复杂的实时互动,问题就暴露的淋漓尽致。18年双11的潮流盛典是整个直播团队最黑暗的阶段,连续几个通宵cr代码修bug,晚会现场还是问题不断,现场一边直播一边改bug发布,甚至降级下线一些功能,这个项目差一点就做垮掉。

image.png

从北京回来后我们痛定思痛,开始重构直播端侧方案,抽象直播容器,提供配套的工程调试链路,几个月后的双12和芒果TV合作的人民的宝贝落地了这套方案,从现场可以看到一片祥和,这套方案后来演变发展成了现在的ALive。

直播间的互动率和停留时长是很核心的指标,我们创新突破启动了媒体智能项目,给淘宝直播带来了流媒体互动的方案。

还有基础的播放器,我们的VideoX作为技术项目也进入了多媒体领域的深水区。

灵魂四拷问

上面提到的几个项目,我们在项目初期都会思考几个问题:客户是谁、解决什么问题、使用什么技术方案、带来什么价值。这几个问题思考下来,项目要不要做、怎么做,基本就清晰了,接下来就是细化方案和执行落地。

image.png

同时团队里会产出一张大图,让大家既能看到全貌,又能了解彼此之间的关联,更好的单点突破、全面协作,凝聚成一颗心,共同打好一场仗。

阶段成长和迷茫

在直播的这个阶段,总结了下我主要有以下几个方面的成长:

  • 行业洞察和预判:全面了解自己的业务,竞对的动态;预判趋势,提前布局,反推业务(比如ALive直播小程序)
  • 创新突破:停留时长、互动率下降,如何抢占用户时长,直播视频场景流媒体互动创新
  • 技术深水区:播放器除了多协议支持、低延时优化、单实例控制等,自研播放内核
  • 影响力:ALive、媒体智能、VideoX打造团队技术品牌,跨BU影响力

现阶段依然有些迷茫,但是已经不是方向上的迷茫感了,而是在多媒体领域,前端的核心价值是什么?如何做深做厚?接下来会尝试在集团层面打造Web Media的体系。

▐ 引领点什么

近2年的工作成果得到了认可,晋升到新的层级,对自己也有新的挑战。我觉得接下来,得引领点什么。

去年开始也在往这方面做一些尝试,比如拉通集团组织了多媒体专场分享,倾团队之力打造多媒体前端知识图谱和配套的前端手册,整理经济体多媒体前端大图等,接下来会继续在集团层面建设多媒体前端体系Web Media,今年也加入了W3C的MEIG媒体与娱乐兴趣组 https://www.w3.org/groups/ig/me/participants ,目前在这个组织里跟进和推动W3C关于媒体相关的标准。

image.png

一些感悟

关于业务前端的职业迷茫感,如何摆脱或者说衰减,我觉得最重要的是得找到一个自己愿意持续学习、有领域知识积累的细分方向。我自己找到了,我会在多媒体这个领域持续发展,现在我没有方向上的迷茫。工作了3-5年的同学应该需要回答这样一个问题,自己的技术领域是什么?前端工程化、nodejs、数据可视化、互动、搭建、多媒体?如果确定了自己的技术领域,业务前端的迷茫感应该会衰弱很多。

大家做业务,都有很大的业务压力,但公司对我们的要求是除了业务还要体现技术价值,这就需要我们做事情之前有充分的思考。在评估一个项目的时候,要想清楚3个问题:业务的目标是什么、技术团队的策略是什么,我们作为前端在里面的价值是什么。如果3个问题都想明白了,前后的衔接也对了,这事情才靠谱。

希望大家还是能像最初来阿里的时候一样,能多折腾,保留这种折腾劲,甚至是孩子气,如果你还有的话。

淘系前端团队

主要负责淘宝直播、短视频等多媒体业务,在直播低延时推拉流、视频非线编、播放器、媒体智能、流媒体互动、多媒体开放等方向上持续研究和实践,专注于音视频Web技术的研究,致力于打造国内顶尖的多媒体前端技术团队。

如果对我们团队感兴趣,欢迎来信交流📮:joven.panj@alibaba-inc.com

关注「淘系技术」微信公众号,一个有温度有内容的技术社区~

image.png

大淘宝技术
目录
相关文章
前端技术栈
|
27天前
|
JavaScript 前端开发 架构师
阿里前端常考vue面试题汇总(二)
阿里前端常考vue面试题汇总(二)
前端技术栈
120 0
老板这功能得加钱
|
25天前
|
存储 缓存 前端开发
100道 IT名企前端面试真题,Web前端阿里等大厂面试题汇总
100道 IT名企前端面试真题,Web前端阿里等大厂面试题汇总
老板这功能得加钱
48 0
老板这功能得加钱
|
25天前
|
移动开发 前端开发 JavaScript
【前端面试】前端面试题300道~~熬夜吐血整理,2024年最新大厂面试经验分享稿
【前端面试】前端面试题300道~~熬夜吐血整理,2024年最新大厂面试经验分享稿
老板这功能得加钱
27 0
老板这功能得加钱
|
26天前
|
前端开发 JavaScript 开发工具
4(1),阿里面试官,前端开发面试题目
4(1),阿里面试官,前端开发面试题目
老板这功能得加钱
28 0
前端技术栈
|
27天前
|
缓存 JavaScript 前端开发
阿里前端常考vue面试题汇总(一)
阿里前端常考vue面试题汇总(一)
前端技术栈
95 0
前端技术栈
|
27天前
|
设计模式 前端开发 JavaScript
[干货满满] 三年经验前端的面试经验分享
[干货满满] 三年经验前端的面试经验分享
前端技术栈
150 1
祈澈菇凉
|
7月前
|
前端开发 JavaScript 搜索推荐
2018年各大互联网前端面试题三(阿里)
2018年各大互联网前端面试题三(阿里)
祈澈菇凉
50 0
前端迷
|
10月前
|
算法 前端开发
阿里前端算法题两道
阿里前端算法题两道
前端迷
80 0
_你当像鸟飞往你的山
|
12月前
|
缓存 前端开发 JavaScript
【面试官系列】一道曾经卡得我 “头皮发麻” 的阿里前端(React)面试题 ~
【面试官系列】一道曾经卡得我 “头皮发麻” 的阿里前端(React)面试题 ~
_你当像鸟飞往你的山
98 0
编程技术君
|
前端开发 算法 JavaScript
带你读《2022技术人的百宝黑皮书》——在阿里做前端程序员,我是这样规划的(1)
带你读《2022技术人的百宝黑皮书》——在阿里做前端程序员,我是这样规划的(1)
编程技术君
101 0

大淘宝技术

热门文章

最新文章

  • 1
    优酷中后台前端解决方案-总览
  • 2
    前端常见兼容问题系列6: 一些安卓APP的WebView中<input type="file">不工作
  • 3
    简单编译器前端的实现
  • 4
    利用String.format()使数字最前端自动补零
  • 5
    Flask:使用SocketIO实现WebSocket与前端Vue进行实时推送(gevent-websocket、flask-socketio、flask不出现running on 127..问题)
  • 6
    web前端socket封装库--giraffe
  • 7
    前端打包工具的比较:Webpack vs Parcel vs Rollup
  • 8
    Koala – 开源的前端预处理器语言图形编译工具
  • 9
    前端学习 -- Css -- overflow
  • 10
    这周,我们作前端,实现统一的过滤搜索
  • 1
    借助chat-web前端开源项目搭建属于自己的ChatGPT镜像站
    233
  • 2
    构建高性能Web应用:前端性能优化的关键策略与实践
    154
  • 3
    构建响应式Web界面:现代前端开发的最佳实践
    111
  • 4
    前端开发中的响应式设计与移动优先原则
    44
  • 5
    探索现代Web应用中的微前端架构
    41
  • 6
    前端性能优化实践:从理论到实际操作
    39
  • 7
    构建高效前端项目:模块化与组件化策略
    54
  • 8
    前端发展趋势:WebAssembly、PWA 和响应式设计
    40
  • 9
    前端开发新趋势:Web3、区块链和虚拟现实
    50
  • 10
    架构的未来:微前端与微服务的融合
    88
  • 相关课程

    更多
  • 移动Web前端开发
  • Ajax 前端开发入门与实战
  • 零基础学前端HTML+CSS
  • 前端开发CSS基础
  • 前端开发框架Bootstrap使用教程
  • 相关电子书

    更多
  • Vue.js 在前端服务化上的探索与实践
  • 阿里文娱大前端技术实践
  • 前端代码是怎样智能生成的
  • 相关实验场景

    更多
  • 倚天大数据电商数据分析快速实践
  • 基于阿里云DeepGPU实例,用AI画唯美国风少女
  • 基于 ACK Serverless 解锁你家萌宠的 AI 形象
  • 前端开发基础3:CSS3常见显示属性
  • 前端开发基础6:Node.js和LESS预编译工具
  • 前端开发基础2:VS Code和Edge的联动开发
  • 下一篇
    阿里云免费云服务器ECS领取教程

    PHP网站源码大庆网站推广工具公司许昌网站优化排名报价通辽网站优化公司内江SEO按天扣费黄冈seo排名报价遵义外贸网站设计推荐黄南百度竞价包年推广多少钱昌都网站优化按天计费阳泉网站推广工具抚州网站优化按天收费推荐玉林SEO按天扣费价格黄山百度竞价包年推广公司嘉兴百姓网标王兰州百度关键词包年推广哪家好信阳SEO按天扣费迪庆高端网站设计哪家好九江百度竞价公司福州推广网站报价西乡外贸网站设计推荐塔城百度标王公司阳泉网站搜索优化信阳品牌网站设计鹤岗设计公司网站多少钱金华建设网站达州网站优化排名价格揭阳模板推广公司江门优化公司延安企业网站设计推荐永湖外贸网站设计公司德宏企业网站制作歼20紧急升空逼退外机英媒称团队夜以继日筹划王妃复出草木蔓发 春山在望成都发生巨响 当地回应60岁老人炒菠菜未焯水致肾病恶化男子涉嫌走私被判11年却一天牢没坐劳斯莱斯右转逼停直行车网传落水者说“没让你救”系谣言广东通报13岁男孩性侵女童不予立案贵州小伙回应在美国卖三蹦子火了淀粉肠小王子日销售额涨超10倍有个姐真把千机伞做出来了近3万元金手镯仅含足金十克呼北高速交通事故已致14人死亡杨洋拄拐现身医院国产伟哥去年销售近13亿男子给前妻转账 现任妻子起诉要回新基金只募集到26元还是员工自购男孩疑遭霸凌 家长讨说法被踢出群充个话费竟沦为间接洗钱工具新的一天从800个哈欠开始单亲妈妈陷入热恋 14岁儿子报警#春分立蛋大挑战#中国投资客涌入日本东京买房两大学生合买彩票中奖一人不认账新加坡主帅:唯一目标击败中国队月嫂回应掌掴婴儿是在赶虫子19岁小伙救下5人后溺亡 多方发声清明节放假3天调休1天张家界的山上“长”满了韩国人?开封王婆为何火了主播靠辱骂母亲走红被批捕封号代拍被何赛飞拿着魔杖追着打阿根廷将发行1万与2万面值的纸币库克现身上海为江西彩礼“减负”的“试婚人”因自嘲式简历走红的教授更新简介殡仪馆花卉高于市场价3倍还重复用网友称在豆瓣酱里吃出老鼠头315晚会后胖东来又人满为患了网友建议重庆地铁不准乘客携带菜筐特朗普谈“凯特王妃P图照”罗斯否认插足凯特王妃婚姻青海通报栏杆断裂小学生跌落住进ICU恒大被罚41.75亿到底怎么缴湖南一县政协主席疑涉刑案被控制茶百道就改标签日期致歉王树国3次鞠躬告别西交大师生张立群任西安交通大学校长杨倩无缘巴黎奥运

    PHP网站源码 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化