主頁 > 企業開發 > “前端”工匠系列(一):合格的工匠,究竟該搞什么 | 京東云技術團隊

“前端”工匠系列(一):合格的工匠,究竟該搞什么 | 京東云技術團隊

2023-05-05 09:56:03 企業開發

作者:京東零售 劉偉東

此文為系列文章第一篇,為淺嘗輒止的引入,目的是為了讓前端從業人員及非從業但是對此領域感興趣的人對于”前端“是干什么的這個話題有個無門檻的了解,

“前端職能是什么”

說起"前端",維基百科對這個技術角色的定位是“前端(英語: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端日志來說,更多的是對現場故障的復現、處理及跟進,如果演算法策略對用戶日志有需要,只需要在一定時間內采用處理任務對用戶日志進行一次處理,把輸出的標簽、行為特征等關鍵資料存盤就可以,基礎的用戶日志還是應該被存檔或清除釋放資源供給更有價值的最新日志來使用,

綜上所述,實時監控和非實時監控分別應對兩種場景:實時對應“業務可用性、線上運行時例外”等使用訴求,非實時對應“性能指標、用戶日志查詢、用戶行為復現”等使用訴求,

“后續”

之后會繼續講述一些有關"用戶體驗、效率提升、頁面搭建"相關的話題,

轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/551692.html

標籤:其他

上一篇:“前端”工匠系列(一):合格的工匠,究竟該搞什么 | 京東云技術團隊

下一篇:返回列表

標籤雲
其他(158467) Python(38117) JavaScript(25401) Java(18013) C(15222) 區塊鏈(8261) C#(7972) AI(7469) 爪哇(7425) MySQL(7162) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5871) 数组(5741) R(5409) Linux(5335) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4565) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2432) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1965) Web開發(1951) HtmlCss(1932) python-3.x(1918) 弹簧靴(1913) C++(1912) xml(1889) PostgreSQL(1874) .NETCore(1857) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • IEEE1588PTP在數字化變電站時鐘同步方面的應用

    IEEE1588ptp在數字化變電站時鐘同步方面的應用 京準電子科技官微——ahjzsz 一、電力系統時間同步基本概況 隨著對IEC 61850標準研究的不斷深入,國內外學者提出基于IEC61850通信標準體系建設數字化變電站的發展思路。數字化變電站與常規變電站的顯著區別在于程序層傳統的電流/電壓互 ......

    uj5u.com 2020-09-10 03:51:52 more
  • HTTP request smuggling CL.TE

    CL.TE 簡介 前端通過Content-Length處理請求,通過反向代理或者負載均衡將請求轉發到后端,后端Transfer-Encoding優先級較高,以TE處理請求造成安全問題。 檢測 發送如下資料包 POST / HTTP/1.1 Host: ac391f7e1e9af821806e890 ......

    uj5u.com 2020-09-10 03:52:11 more
  • 網路滲透資料大全單——漏洞庫篇

    網路滲透資料大全單——漏洞庫篇漏洞庫 NVD ——美國國家漏洞庫 →http://nvd.nist.gov/。 CERT ——美國國家應急回應中心 →https://www.us-cert.gov/ OSVDB ——開源漏洞庫 →http://osvdb.org Bugtraq ——賽門鐵克 →ht ......

    uj5u.com 2020-09-10 03:52:15 more
  • 京準講述NTP時鐘服務器應用及原理

    京準講述NTP時鐘服務器應用及原理京準講述NTP時鐘服務器應用及原理 安徽京準電子科技官微——ahjzsz 北斗授時原理 授時是指接識訓通過某種方式獲得本地時間與北斗標準時間的鐘差,然后調整本地時鐘使時差控制在一定的精度范圍內。 衛星導航系統通常由三部分組成:導航授時衛星、地面檢測校正維護系統和用戶 ......

    uj5u.com 2020-09-10 03:52:25 more
  • 利用北斗衛星系統設計NTP網路時間服務器

    利用北斗衛星系統設計NTP網路時間服務器 利用北斗衛星系統設計NTP網路時間服務器 安徽京準電子科技官微——ahjzsz 概述 NTP網路時間服務器是一款支持NTP和SNTP網路時間同步協議,高精度、大容量、高品質的高科技時鐘產品。 NTP網路時間服務器設備采用冗余架構設計,高精度時鐘直接來源于北斗 ......

    uj5u.com 2020-09-10 03:52:35 more
  • 詳細解讀電力系統各種對時方式

    詳細解讀電力系統各種對時方式 詳細解讀電力系統各種對時方式 安徽京準電子科技官微——ahjzsz,更多資料請添加VX 衛星同步時鐘是我京準公司開發研制的應用衛星授時時技術的標準時間顯示和發送的裝置,該裝置以M國全球定位系統(GLOBAL POSITIONING SYSTEM,縮寫為GPS)或者我國北 ......

    uj5u.com 2020-09-10 03:52:45 more
  • 如何保證外包團隊接入企業內網安全

    不管企業規模的大小,只要企業想省錢,那么企業的某些服務就一定會采用外包的形式,然而看似美好又經濟的策略,其實也有不好的一面。下面我通過安全的角度來聊聊使用外包團的安全隱患問題。 先看看什么服務會使用外包的,最常見的就是話務/客服這種需要大量重復性、無技術性的服務,或者是一些銷售外包、特殊的職能外包等 ......

    uj5u.com 2020-09-10 03:52:57 more
  • PHP漏洞之【整型數字型SQL注入】

    0x01 什么是SQL注入 SQL是一種注入攻擊,通過前端帶入后端資料庫進行惡意的SQL陳述句查詢。 0x02 SQL整型注入原理 SQL注入一般發生在動態網站URL地址里,當然也會發生在其它地發,如登錄框等等也會存在注入,只要是和資料庫打交道的地方都有可能存在。 如這里http://192.168. ......

    uj5u.com 2020-09-10 03:55:40 more
  • [GXYCTF2019]禁止套娃

    git泄露獲取原始碼 使用GET傳參,引數為exp 經過三層過濾執行 第一層過濾偽協議,第二層過濾帶引數的函式,第三層過濾一些函式 preg_replace('/[a-z,_]+\((?R)?\)/', NULL, $_GET['exp'] (?R)參考當前正則運算式,相當于匹配函式里的引數 因此傳遞 ......

    uj5u.com 2020-09-10 03:56:07 more
  • 等保2.0實施流程

    流程 結論 ......

    uj5u.com 2020-09-10 03:56:16 more
最新发布
  • “前端”工匠系列(一):合格的工匠,究竟該搞什么 | 京東云技術團隊

    此文為系列文章第一篇,為淺嘗輒止的引入,目的是為了讓前端從業人員及非從業但是對此領域感興趣的人對于”前端“是干什么的這個話題有個無門檻的了解。 ......

    uj5u.com 2023-05-05 09:56:03 more
  • “前端”工匠系列(一):合格的工匠,究竟該搞什么 | 京東云技術團隊

    此文為系列文章第一篇,為淺嘗輒止的引入,目的是為了讓前端從業人員及非從業但是對此領域感興趣的人對于”前端“是干什么的這個話題有個無門檻的了解。 ......

    uj5u.com 2023-05-05 09:55:51 more
  • 三步 讓你的 vscode 自動編譯ts檔案

    1:環境安裝 tsc 作用:負責將ts 代碼 轉為 瀏覽器 和 nodejs 識別的 js代碼。 /全域安裝 npm install -g typescript // 檢查是否安裝成功 tsc -v 2:自動編譯 運行 tsc --init,創建 tsconfig.json 檔案;修改 tsconf ......

    uj5u.com 2023-05-05 09:38:48 more
  • 記錄-物件有哪些繼承方式

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 1. 原型鏈 溫故而知新: 建構式、原型和實體的關系: 每個建構式都有一個原型物件,原型有一個屬性指回建構式,實體有一個內部指標指向原型。 思考:如果原型是另一個型別的實體呢? 那就意味著這個原型本身有一個內部指標指向另一個原型,相 ......

    uj5u.com 2023-05-05 09:38:39 more
  • HTML中link標簽的那些屬性

    在HTML中, link 標簽是一個自閉合元素,通常位于檔案的 head 部分。它用于建立與外部資源的關聯,如樣式表、圖示等。 link 標簽具有多個屬性,其中 rel 和 href 是最常用的。 rel 屬性定義了當前檔案與鏈接資源之間的關系。常見的 rel 屬性值有: - stylesheet ......

    uj5u.com 2023-05-05 09:38:32 more
  • 你想要的【微前端】都在這里了!

    某次遇到一個從0到1的大型專案,該專案涉及兩個端,除了鑒權和部分業務邏輯不同外,頁面UI和其余邏輯幾乎一致,遇到這種專案,該如何架構?既能保證專案順利開發完成,又能保證后期的迭代、維護、可擴展? ......

    uj5u.com 2023-05-05 09:38:23 more
  • 記錄-物件有哪些繼承方式

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 1. 原型鏈 溫故而知新: 建構式、原型和實體的關系: 每個建構式都有一個原型物件,原型有一個屬性指回建構式,實體有一個內部指標指向原型。 思考:如果原型是另一個型別的實體呢? 那就意味著這個原型本身有一個內部指標指向另一個原型,相 ......

    uj5u.com 2023-05-05 09:32:57 more
  • HTML中link標簽的那些屬性

    在HTML中, link 標簽是一個自閉合元素,通常位于檔案的 head 部分。它用于建立與外部資源的關聯,如樣式表、圖示等。 link 標簽具有多個屬性,其中 rel 和 href 是最常用的。 rel 屬性定義了當前檔案與鏈接資源之間的關系。常見的 rel 屬性值有: - stylesheet ......

    uj5u.com 2023-05-05 09:32:31 more
  • 2023前端面試題一

    元素型別 空元素 br hr 塊級元素 div footer header section p h1 h6 行內元素 img input span 元素型別轉換 display:block 獨占一行,可以設定寬高 display:inline 不獨占一行,不可以設定寬高 display:inline ......

    uj5u.com 2023-05-04 08:09:56 more
  • 寫幾行代碼,了解回應式原理

    作者:袁首京 原創文章,轉載時請保留此宣告,并給出原文連接。 作為當下的開發人員,無論是不是前端,可能都會頻繁的與 React、Vue、Svelte、Solidjs 等等打交道。也許你已經很清楚它們背后的運作原理,那不必往下看了。如果還不是很清楚,那咱們可以一起寫幾行代碼,來瞅一眼這些回應式框架背后 ......

    uj5u.com 2023-05-04 08:09:50 more