“前端”工匠系列(一):合格的工匠,究竟该搞什么

“前端”工匠系列(二):合格的工匠,怎么做好价值落地

此文为系列文章第一篇,为浅尝辄止的引入,目的是为了让前端从业人员及非从业但是对此领域感兴趣的人对于”前端“是干什么的这个话题有个无门槛的了解。

“前端职能是什么”

说起"前端",维基百科对这个技术角色的定位是“前端(英語:front-end)和后端(英語:back-end)是描述进程开始和结束的通用词汇。 前端作用于采集输入信息,后端进行处理。 计算机程序的界面样式,视觉呈现属于前端。”对于当下服务于互联网各企业的前端研发人员来说,这个岗位定义是很清晰的。前端是个对于后端的相对概念,它的岗位角色更应该关注“采集和呈现”两个部分。

从以上的概念来看,前端研发的正常职责是通过编码工作对数据及业务逻辑进行展示,用户通过操作界面(或其他交付方式)与系统进行交互,最后用户的交互信息可以按照功能逻辑的预期传输到后端服务递交给业务后端及更下游的算法层处理。



“编码工作包括什么呢?”

前端研发人员工作对接的上游干系人包括产品和UI设计,必要输入有产品文档和UI设计稿件,下游干系人为后端研发人员,必要的输出为一整套界面交互及逻辑处理实现代码。

产品要向研发团队输出PRD(产品需求文档Prodcut Requirement Document的简称)来对此次产品或者迭代的具体的功能细节进行详细的描述,通过需求评审会议的方式与研发人员和设计人员进行“语言的互通转换及翻译”工作,得以把所有的产品逻辑向不同专业人员表达清晰,这是一切需求交付最重要的环节。对于新增的或者复杂的需求,需要有交互设计人员与产品人员共同输出交互设计稿件,从另外一个维度对产品需求逻辑进行阐述,对于前端研发人员对于需求理解的清晰程度来看,交互设计稿件的严谨和质量十分重要。

UI设计人员需要根据产品需求文档和交互设计稿件对界面的UI风格、色系及动效等素材进行设计画制作,向研发人员输出UI设计稿件,此项工作需要前端研发、产品和设计人员进行多轮沟通以便敲定所有元素细节。UI设计稿件的设计质量和对产品逻辑的描述精细度,直接对前端研发人员的编码设计方式和效率产生影响,前端研发人员必须对UI设计稿件有足够的重视,避免在实现过程中反复与产品和设计人员对设计稿件的细节进行确认甚至重新设计。如果这种情况出现,势必对项目的排期产生影响。最后,前端研发的界面输出要通过UI设计人员的验收测试才算完成界面编码工作。

与后端研发人员的对接是研发工作中的重中之重,最终,一整套前后端研发人员公认的经过冒烟用例自测的代码包才是此阶段的合格产出物。接口规范、约定习惯以及默契度较高的对接伙伴,都是业界不断在研发调试、联合调试以及提测冒烟过程中提效降本的思路。“一切都是人的事”“约定大于习惯”这些对软实力、流程的严谨程度都提出了要求。

研发流程中最后的步骤是UAT验收后上线。上线一定要采用“流水线自动化”的方式才行,也就是大家常说的“CI/CD”。只有这样做,才能保证主干版本代码与线上代码版本完全保证一致,不会因为人为把自己本地代码编译打包后发布到线上,导致主干分支成为摆设;所有上线相关的合并、编译、打包、发布等核心流程都是流水线自动跑事先部署在流水线各个节点的脚本,才能避免人为操作“失误”导致的线上问题。

“上线了?”

上线是个很值得探讨的话题,因为对于研发来说,只有上了线并且发挥了预期或者超预期的业务价值的代码,才算是对企业、对社会有一点点贡献,个人的价值才能在工作中得以体现。上线完成就是研发工作的结束吗?对于很多研发团队来说,这就是最后一步了。但是,研发流程仅仅止步于此,是不符合“合格”这个标准的。一套代码,只有在上线后,才开始受到真正用户的亲测使用,研发人员的产出物才算是“生命开始”。产品功能在用户的使用中“表现是否符合预期”、“是否有边界异常”、“是否存在打不开页面的情况”、“是否存在显示异常的情况”,诸如此类的问题,都应该是产研需要关注的话题。

因此,研发人员需要预先在代码包中预留与线上真实用户“交流”的抓手,通过分析用户在“可用性和性能”做出可以提升用户体验的改进措施,例如,“特殊逻辑自定义埋点上报”、“边界兜底监控”、“系统运行时监控”等,只有做到了这些,才能说对一个用户功能的真正上线,后续也才有精细化运营的可能。可是,对于很多研发人来说,“上线即需求的终点”、“线上问题由业务反馈”、“有客诉吗?”都是研发普遍存在的心理。

那如何通过“预先”的方式建立与用户之前的沟通通道呢?因为此文为前端领域文章,所以我们此次只说前端部分。

“与用户交流”

有效的交流是需要以有效的信息为载体的。对于技术实现来说,就是对核心代码块进行合理的代码埋点。当特殊用户行为发生时,当代码处理逻辑走向了一个非正常的处理单元时,当发生了代码处理逻辑没有覆盖到的情形时,埋点上报代码就会触发执行,向中心化的埋点服务发送消息。技术人员通过对此次用户行为触发的埋点信息的分析,从而得到用户在浏览或操作页面过程中的“正常或异常”情况的“现场复现”,当然,这种复现可以是数据信息,也可以是截图或视频回溯,具体要用什么方式来复现用户行为,要以“有效”为目标,综合考虑“用户流量成本、研发成本、性能影响以及存储成本”等因素来最终选型。

“实时 OR T+1”

对于业务前端用户行为及触发逻辑的监控,有实时监控和异步监控两种。

在实时关注用户行为、实时分析等场景里,需要使用实时监控,这个“实时”,一般到秒级就够用了,一些业务使用分钟级也是可以的,具体看业务的需要。对于实时监控,上报行为是从每一台用户的设备上触发并上报的,应用于大体量业务来说,这个数据量的采集、上报、收集、存储、分析和报表的生成,都是相当耗费资源的。为了降本提效,埋点服务首先会对用户数据按照特殊的规则(比如正态分布)进行一层比例的抽样,降低分析及报表生成过程中对资源和人力的消耗。

在用户端日志查询、特殊边界场景复现、日志排查定位故障等场景,“实时”就不是必要的,这种场景下一般采用T+1查询,但是又引入了大量级日志的存储周期的话题,一般企业应用级的用户日志保存14天就完全够用了,因为对于C端日志来说,更多的是对现场故障的复现、处理及跟进,如果算法策略对用户日志有需要,只需要在一定时间内采用处理任务对用户日志进行一次处理,把输出的标签、行为特征等关键数据存储就可以,基础的用户日志还是应该被存档或清除释放资源供给更有价值的最新日志来使用。

综上所述,实时监控和非实时监控分别应对两种场景:实时对应“业务可用性、线上运行时异常”等使用诉求,非实时对应“性能指标、用户日志查询、用户行为复现”等使用诉求。

“后续”

之后会继续讲述一些有关"用户体验、效率提升、页面搭建"相关的话题。

相关推荐

业务复杂度治理方法论--十年系统设计经验总结

软件设计的核心在于降低复杂性。--《软件设计的哲学》业界对于复杂度并没有统一的定义,斯坦福教授John Ousterhout从认知负担和工作量方面给出了一个复杂度量公式子模块的复杂度cp乘以该模块对应的开发时间权重值tp,累加后得到系统的整体复杂度C这里的子模块复杂度cp是一个经验值需要注意:如果一个子系统特别复杂,但是很少使用及修改,也不会对整体复杂度造成太大影响。例:spring框架内部代码较为复杂,但由于几乎不需要我们去变动,所以对系统的整体复杂度影响并不大。

JDDTechTalk的博客 2432

【转载】golang内存分配

在 1.10 以前 go 的堆地址空间是线性连续扩展的, 比如在 1.10(linux amd64)中, 最大可扩展到 512GB. 因为 go 在 gc 的时候会根据拿到的指针地址来判断是否位于 go 的 heap 的, 以及找到其对应的 span, 其判断机制需要 gc heap 是连续的. 但是连续扩展有个问题, cgo 中的代码(尤其是 32 位系统上)可能会占用未来会用于 go heap 的内存. 这样在扩展 go heap 时, mmap 出现不连续的地址, 导致运行时 throw.

JDDTechTalk的博客 1476

自增主键去哪了?---一次开发过程中的思考

MySQL是作为大家都经常接触的DB,相信大家都会有一定的认知,自增主键不连续大家肯定也遇到过,这次在联调过程中遇到这个情况,在跟别的小伙伴分享的时候,突然就想写一篇文章,文章里面如果有不正确或者不准确的地方也欢迎大家斧正~说实话,作为一名交易端的研发人员,业务开发任务压力真的蛮大的,我也迷茫过,如何在这个过程中成长,珍惜我们遇到的问题,将遇到的问题记录在册,深追问题,你会发现有很多问题其实真的是因为我们某些知识的薄弱点造成的。

JDDTechTalk的博客 1670

万字长文浅谈三高系统建设方法论和实践

整个软件的发展历程是一部软件复杂性对抗史,软件的复杂性分为技术复杂性和业务复杂性,业务复杂性主要是建模和抽象设计,技术复杂性主要是三高(高性能,高并发,高可用)的应对,C端的业务一般以技术复杂性为主,业务复杂性为辅,而B端或者M端的业务通常以业务复杂性为主,技术复杂性为辅。本篇文章主要是从后端研发的视角结合自己多年的B C端系统建设实践谈下三高系统的建设方法论和实践,希望和大家相互交流,共同进步,同时这是我参与创作者计划的第1篇文章。

JDDTechTalk的博客 2517

Vision Pro开发实践(结合24黑马idea)

利用ModelEntity加载模型,添加到RealityView的content中展示,这样可以对模型做各种操作,比如添加子模型,修改光照,材质等要素。举个例子来讲,我需要在运动鞋模型“sneaker”上面添加一个可以与用户交互的白色圆点模型,用于在用户点击的时候添加/展示对应部分的评价。这次结合的idea是我参加黑马比赛时想到的,主要内容是:在商品评价时增加商品的3D模型,用户可以在虚拟现实环境中查看商品的3D模型,并对模型的特定位置进行评论。:通过3D模型动画,用户可以直观地了解产品的特性和使用方法。

JDDTechTalk的博客 2168

买药秒送 JADE动态线程池实践及原理浅析

买药秒送是健康即时零售业务新的核心流量场域,面对京东首页高流量曝光,我们对频道页整个技术架构方案进行升级,保障接口高性能、系统高可用。动态线程池是买药频道应用的技术之一,我们通过3轮高保真压测最终初步确定了线程池的核心参数。但我们仍面临一些保障系统稳定性问题:如何监控线程池运行状态?以及因流量飙升出现任务堆积和拒绝时能否实时报警,线程池核心参数能否做到不重启应用,动态调整即时生效?经调研,业界成熟的动态线程池开源项目有dynamic-tp和hippo4j。

JDDTechTalk的博客 2042

从原理聊JVM(一):染色标记和垃圾回收算法

本篇介绍了JVM中垃圾回收器相关的基础知识,后续会深入介绍CMS、G1、ZGC等不同垃圾收集器的运作流程和原理,欢迎关注。。

JDDTechTalk的博客 1906

BFF层聚合查询服务异步改造及治理实践

本篇主要是思考如何依赖现有框架、环境的能力,从代码层面系统化的实现相关治理规范。最后仍引用王晓老师文章结尾来结束。

JDDTechTalk的博客 1912

QPS提升10倍的sql优化

总结本次优化经历•慢sql 往往是影响数据库性能的大瓶颈,sql写好了不但可以优化性能,还能节约机器成本,降本增效。•最好能看到sql语句执行的第一现场,本次主要是由于查看代码时没有及时注意到索引字段的传参类型不对这一细节,造成花了很多时间分析问题•虽然整个问题分析过程比较曲折,但问题分析的方向应该还是对的,过程中学到不少知识。•表结构的设计也有一些历史遗留原因,site_id 字段在表中定义为整型可能比较符合业务含义。表字段定义和业务含义一致,写sql也不容易犯错。

JDDTechTalk的博客 1783

一站式统一返回值封装、异常处理、异常错误码解决方案—最强的Sping Boot接口优雅响应处理器

Graceful Response内置了两种风格的响应格式,可以在文件中通过进行配置。•gr.responseStyle=0,或者不配置(默认情况)"msg": "有内鬼,终止交易"},"data": {•自定义响应格式如果以上两种格式均不能满足业务需要,可以通过自定义去满足,Response@Override@Override@Override@Overridereturn msg;注意,不需要返回的属性可以返回null或者加上注解。

JDDTechTalk的博客 1986

【原创】【深入浅出系列】之代码可读性

原创声明:该文章是个人在项目中亲历后的经验总结和分享,如有搬运需求请注明出处。这是“深入浅出系列”文章的第一篇,主要记录和分享程序设计的一些思想和方法论,如果读者觉得所有受用,还请“一键三连”,这是对我最大的鼓励。一句话:见名知其义。有人说好的代码必然有清晰完整的注释,我不否认;也有人说代码即注释,是代码简洁之道的最高境界,我也不否认。但我都不完全接受,如果照搬前者,有人会在每个方法、每个循环、每个判断都添加大量注释,对于一个表达不严谨的coder来说,代码与汉字可能词不达意;

JDDTechTalk的博客 1741

动态化-鸿蒙跨端方案介绍

动态化目前已经具备一份代码在iOS、Android、H5三端运行的能力,该方案就是将动态化一码多端能力对接到鸿蒙系统,降低首次适配研发投入;一次开发,四端共用,长期降低业务迭代成本;并且使业务具备随时发布能力。。

JDDTechTalk的博客 2618

【ChatGPT应用篇-1】助力Beauty代码的初体验

以下是一个与ChatGPT 结对编程的一个Excel数据解析案例,大家可以根据我的思考过程进行体验,以下放了一些截图,ChatGPT的反应速度惊人,代码版本一步步进行迭代优化,感触较深的是。对于ChatGPT输出的代码没有做仔细的Review及调试,但是看代码风格基本上是改改就能用于生产的,对于代码规范、命名还是很认可的!10.提升程序效率,把解析性能在提升10倍 (架构师的成本意识,这个问题的回答有点意思)6.替换掉 poi 采用EasyExcel (替换原始的默认技术选型,替换三方包)

JDDTechTalk的博客 1516

一文了解电商大促系统的高可用保障思路-献给技术伙伴们

电商大促是电商平台组织的一种大型销售推广活动,目的是通过提供各种优惠、折扣等方法,提高商品销售额和网站流量,增加消费者的购物欲望,以实现销售目标。电商大促活动通常会在一些特定的节点或者节日举行,比如“双11”、“618”、“黑色星期五”等,这些时期的电商大促极具吸引力,既有大量的商品打折优惠,又有丰富多样的活动供消费者参与,是电商平台提升销售业绩的重要手段。

JDDTechTalk的博客 2114

一起单测引起的项目加载失败惨案

是相对于静态编程而言的,平时我们讨论比较多的就是静态编程语言,例如Java,与动态编程语言,例如JavaScript。最近在开发一个功能模块时,在功能自测阶段,通过使用单测测试功能的完整性,在测试单测联通性使用到静态方法测试时,发现单测报错,通过查阅解决方案发现需要对。建议大家在构建Maven项目时,仔细检查POM文件中的依赖,确保没有漏掉任何必要的库,以免因为遗漏而引起不必要的问题。但是,在我们的POM文件中,虽然我们添加了对Spring框架的依赖,但是并没有添加。: 返回修改后的字节码。

JDDTechTalk的博客 1900

京东小程序折叠屏适配探索

应用在折叠屏运行时,可以从一个屏幕切换到另一个屏幕。应用应该做好配置变更的适配和界面状态的保存,以保证应用当前任务能无缝迁移到转换后的屏幕,从而为用户提供出色的连续性体验。折叠屏作为未来Android屏幕发展的新趋势,具有很大的发展前景,做好折叠屏相关适配支持也势在必行。小程序相关适配已经跟随京东主站、小家App、小家三星预装版等发布上线,本文是作者进行相关适配的一些心得体会,如有不足敬请见谅,欢迎交流探讨。

JDDTechTalk的博客 1万+

KubeCon China 2024全球大会在香港举行,京东云受邀参加探讨云原生、开源及 AI

和数字化大潮一样,在AI化的革命下,云端也在全面拥抱AI,并在方方面面变得更安全、更高效,让全球各行各业受益。大会首日吸引了来自全球 30 多个国家和地区的 1000 多名参会者,共同探讨云原生、开源及 AI 领域的前沿进展、核心技术和最佳实践。在京东云中,联邦Serverless服务基于联邦管理模型和Serverless应用模型,为联邦应用容器部署、弹性扩展和故障迁移提供JDOS应用容器控制服务。弹性扩缩容技术方案有很广大的应用前景,京东云内部也在进行大量的生产实践和验证。1. 多集群管理和分发实践。

JDDTechTalk的博客 1162

京东搜索重排:基于互信息的用户偏好导向模型

。

JDDTechTalk的博客 1927

探索AC自动机:多关键词搜索的原理与应用案例

目前,大多数自由文本搜索技术采用类似于Lucene的策略,通过解析搜索文本为各个组成部分来定位关键词。这种方法在处理少量关键词时表现良好。但当搜索的关键词数量达到10万个或更多时,这种方法的效率会显著下降,尤其是在需要与词典进行详尽对比的场景中。本文将介绍的Aho-Corasick(AC)自动机作为多模式匹配中的经典算法,不仅能够处理大规模文本数据,还能确保搜索过程的实时性和准确性。AC自动机可以被形象地比喻为一个超级找词机器。

JDDTechTalk的博客 1479

mysql磁盘碎片整理

不管是使用云还是商城数据库,只要使用mysql,必然会遇到Mysql碎片问题痛点,数据量大的业务表应该设计成分区表方便磁盘碎片整理,降低维护成本和业务影响。碎片清理前后,IO性能会上升,SQL执行效率更快。所以,在日常运维工作中,应对碎片进行定期清理,保证数据库有稳定的性能和充足的空间。扩展提到提高IO性能,在紧急情况下还可以考虑开启刷盘(设置),但开启刷盘会有数据丢失风险(集团数据库模板配置参数默认。

JDDTechTalk的博客 1101

【我在京东做产研】校招 2 年,个人角度(成长)回顾 - 行且知

回顾毕业后的工作历程(文章会以现实时间为顺序来进行回顾),有很多大佬的帮助和指点。因此,想将自己的思考也分享给后来的同学们文章从个人角度(成长)出发,回顾工作点滴。后续会从团队角度(互惠)出发,写成长历程二,敬请期待1.JD的技术体系,各种中间件的了解和使用▪各种中间件的使用文档,还是非常有价值的,各种各样的名词,使用细节。如果你都不知道,怎么细节性学习?▪切勿眼高手低:▪程序员都知道文档易读,但是不如手敲一遍。敲完运行运行,可能你就有新的疑问。(例如:JSF 配置后,如何生成代理对象的呀)

JDDTechTalk的博客 920

京东云《黑神话 · 悟空》现已支持快速部署!

黑神话:悟空》是一款以中国神话为背景的动作角色扮演游戏。本服务内置《黑神话:悟空》游戏、《Steam》客户端和远程桌面《GameViewer》软件,配备顶级游戏显卡,通过计算工厂快速部署后按下方文档操作即可开启流畅游戏体验。

JDDTechTalk的博客 1420

京东平台内容合规的技术与挑战

合规域在电商平台中扮演着重要的角色,它相当于电商体系中的“免疫系统”,通过识别恶意的商品、商家以及UGC内容,确保电商生态的健康、有序和可持续发展。因此我们部门致力于打造业内领先的内容理解与审核平台,在具体工作中,通过识别并治理商家在产品、价格、服务维度的违规行为以及短视频、直播、评价、问答等内容的违规信息,降低审核成本、提升运营效率,并最终保障用户体验。。

JDDTechTalk的博客 1095

视频审核架构实践

针对不同的编码器、封装协议、传输协议,提供统一的音视频处理接口。跨平台,兼容200多种编码、180多种封装格式、20多种传输协议。世界上90%以上的音视频开发基于FFmpeg。。

JDDTechTalk的博客 1595

QUIC在京东直播的应用与实践

国内的互联网直播技术从2005年前后兴起,彼时最具代表性的直播产品是由PPLive创始人姚欣在华中科技大学就读期间发起的校园直播项目PPLive。当时的直播技术用的还是基于windows系统自带的mediaplayer内置的COM组件开发的播放器,采用的是RTSP协议。受当时的互联网传输带宽及成本限制,PPLive并没有采用现在比较流行的单播技术,而是采用P2P技术分发直播流。国内的直播技术也进入了一段以P2P技术为主的时期,其中比较有代表性的就是PPLive和PPStream。

JDDTechTalk的博客 1401

突破传统监测模式:业务状态监控HM的新思路

以上是hm的全部技术细节。hm灵魂是数据计算、治理、数据统计。hm根基是集成百家之长。是我们平台研发部自研的一款面向业务的,异常监控处理的解决方案。汇集了团队每位伙伴的智慧。

JDDTechTalk的博客 1237

如何优雅的处理异常

Java 语言按照错误严重性,从 throwale 根类衍生出 Error 和 Exception 两大派系。Error(错误):程序在执行过程中所遇到的硬件或操作系统的错误。错误对程序而言是致命的,将导致程序无法运行。常见的错误有内存溢出,jvm 虚拟机自身的非正常运行,calss 文件没有主方法。程序本生是不能处理错误的,只能依靠外界干预。Error 是系统内部的错误,由 jvm 抛出,交给系统来处理。程序正常运行中,可以预料的意外情况。比如数据库连接中断,空指针,数组下标越界。

JDDTechTalk的博客 1186

鸿蒙跨端实践-ArkTS和CAPI的混合开发实现

针对以上问题,通过和华为沟通,鸿蒙系统提供了C语言的命令式接口。C组件接口是介于UI组件的Native实现和ArkTS对接层之间的一层C接口封装,它绕过了状态管理对组件变化、刷新的自动化管理,同时避免了JS引擎和C++之间类型转换和跨语言调用的开销,因此具有较好的性能。通过C接口的对接,UI层级能直接和另外两端基本一致,通讯过程直接从JS到C++,C++可以直接调用C接口,流程大大缩短,数据类型转换变少了,列表渲染过程也由接入方自主控制,并且可以做预渲染等优化方案,同时避免了系统的二次布局。。

JDDTechTalk的博客 1745

Proxyless的多活流量和微服务治理

Joylive Agent 是一个基于字节码增强的框架,专注于多活和单元化场景下的流量治理。它提供了以下功能:多活流量调度、全链路灰度发布、QPS和并发限制、标签路由、负载均衡,熔断降级,鉴权等流量治理策略。其特性包括微内核架构、强类隔离、业务零侵入等,使其在保持高性能的同时对业务代码影响最小,是面向Java领域的新一代Proxyless Service Mesh探索实现。重要的事情说三遍:求Star,求Star,求Star。请Star完毕后继续阅读后文。

JDDTechTalk的博客 1812

工作五年小结 | 面对不确定性快速上升的外部环境,我们该如何寻求突破?

工作五年了,来京东马上满一年,前四年在开水团,不禁感叹时间过的真快啊!回想19年从西安交大硕士毕业孤身前往北京开始职业生涯,经历了孤独迷茫到自立坚定,再到23年下定决心携妻还蜀安家,并来到京东开始新的征程,这5年过的很快也很充实。今年也是我的而立之年,感觉一迈过这个坎,眼前的世界就不一样了,事业上还未成气候,更多的生活琐事就开始扑面而来。网上有段子笑称现代的“五子登科”中的五子分别指的是“车子、票子、房子、妻子和孩子”,这个词本来表达的是人们对美好生活的向往,但旧词新义体现更多的是中年人的无奈。。

JDDTechTalk的博客 848
上一篇: mysql磁盘碎片整理
下一篇: 探索AC自动机:多关键词搜索的原理与应用案例
京东云技术团队
京东云技术团队 企业官方账号 企业官方账号
博客等级 码龄6年 3618粉丝 686原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值