web前端工程師在移動互聯網時代裏的地位問題

　　支付寶十週年推出了一個新產品：支付寶的十年帳單，我也趕個時髦查看了一下個人支付寶十年帳單，哎，感慨本身真是太屌絲了，不過這只是說明我使用淘寶少了，當我大規模網上購物時候，我很討厭慢速的快遞，因此我大部分消費都貢獻給了像京東這樣具備火箭般快遞速度的電子商城了。不過在支付寶十年帳單裏，有個統計數據引發了個人危機意識，在中國一些偏遠或者是經濟欠發達的省份，電子購物在居民的所有消費裏的佔比比發達地區高多了，而這個的助推劑竟然是移動互聯網在中國的普及，在中國使用智能手機和平板電腦購物的人們已經遠超使用PC電腦的人們，這點無論是經濟欠發達地區仍是經濟發達地區都是如此，並且全世界移動互聯網發展最好的國家就是中國，這點連美國都不如。

　　我最近一段時間又把精力放在了web前端技術的研究上，原本打算這個週末再接着這個主題寫幾篇文章，可是看到支付寶的統計數據，一種末日般的危機感悠然而生，我是否是在研究一個即將過期，就算不是過期，是否是已經快到發展瓶頸的技術呢？我若是不作改變，會不會在不久的時間後，個人web前端技術會喪失優點呢？所以我今天想要分析下移動互聯網對web前端技術的影響。

　　在移動互聯網出現以前，互聯網系統都是創建在Browser/Server的架構之上，即咱們常說的B/S架構，B/S架構實際上是Client/Server即C/S架構的一個子集，而到了移動互聯網時代，大部分的傳統互聯網產品都須要咱們去安裝一個APP即一個客戶端才能使用，這個客戶端至關於PC電腦上的桌面軟件，而每一個客戶端都是某家公司專門爲本身定製的，移動互聯網的web應用蛻變成了一個標準的C/S架構。說內心話這個現象的轉變讓我很詫異，傳統的PC也是能夠裝客戶端，爲啥C/S系統在PC端沒有流行起來，卻在移動互聯網下流行了起來，更詫異的是，移動設備和我的電腦同樣也都是默認裝有一個免費的瀏覽器，爲啥移動端的瀏覽器在不少應用裏都是靠邊站，人們更加傾向於先麻煩本身一下，下載安裝個客戶端APP呢？

　　我今天和一位正在作移動互聯網開發的朋友聊了下天，我提出了本身的疑問，在一系列扯蛋之後，我彷佛有了上面問題的部分答案，我總結了下，大體以下：

1. 移動設備上網雖然可使用WiFi，可是不少人在所謂關鍵時刻使用移動設備上網時候都是在2G、3G、4G移動網絡下進行的，通常狀況下這些網絡的速度和通常寬帶相比仍是太慢，更重要的是這些網絡的資費要貴的多，不少人一個月使用這些網絡上網的資費比寬帶貴不少，可是享受的流量卻經常不足通常寬帶的10%，在使用移動網絡的背景下移動端的B/S網站每每會加載很慢，流量消耗很大，無論是用戶體驗仍是經濟效率考慮都會影響商家產品的競爭力，因此商家須要一種手段改進這種局面。
2. 移動設備自己的CPU、內存以及存儲設備和PC電腦相比，差距仍是很大，一樣的一個應用在PC電腦上處理假如須要10毫秒，換到移動設備上可能會須要幾倍的處理時間，而互聯網上的應用響應時間太慢會致使大量客戶的丟失，商家爲了讓本身應用響應更快，天然就會考慮本身定製客戶端，這個客戶端會根據移動設備特色作相應的性能優化，使應用的響應速度更快。
3. 移動設備自己的安全機制沒有PC電腦成熟和完善，移動端的瀏覽器和PC電腦的瀏覽器相比，就如同一部簡配閹割的汽車，它遠遠沒有PC電腦上的瀏覽器那麼強大，特別是一些瀏覽器的安全機制，移動端瀏覽器是遠不如PC端瀏覽器，這點在智能手機上很是明顯，例如咱們在PC電腦上購物，到了支付環節，無論支付工具使用的是各家銀行的網銀仍是第三方支付系統，都會在輸入銀行卡密碼，信用卡CVN2時候使用密碼控件（密碼控件解釋：咱們使用網銀時候若是不安裝密碼控件，密碼輸入框上會提示咱們下載密碼控件，等控件安裝好了後，文本輸入框就會顯示出來，其實這時候的密碼輸入框已經不是傳統html裏的input密碼輸入框了，而是使用像C這樣的語言編寫的瀏覽器插件模擬的密碼輸入框，咱們在這樣的密碼框裏填寫密碼是很是安全，基本上很難被人截獲），密碼控件會保證關鍵的密碼信息的安全，可是這點到了移動端瀏覽器就很難作到，咱們基本不多見到在手機瀏覽器裏提示咱們安裝密碼控件的現象，就算有，瀏覽器也會調出相應的APP幫助咱們完成支付操做，究其根本緣由仍是移動設備瀏覽器對這類技術支持不夠。
4. 在瀏覽器裏開發一套漂亮、用戶體驗好、安全的網站仍是頗有難度的，不過技術難度都是內部問題，對外都不是問題，問題的關鍵是分辨率的問題，移動設備屏幕有大有小，這種差別和PC電腦相比簡直是恐怖，而瀏覽器的佈局技術每每又是跟分辨率有着千絲萬縷的關係，其中最致命的一個問題就是有的移動設備的屏幕大點，它也許能夠在一行裏顯示出三個元素，可是到了一個屏幕小的手機上一行顯示三個元素就會使得頁面嚴重變形，而瀏覽器的排版技術行row是一個基本邊界，元素若是碰到換行顯示就會打亂整個佈局系統，因此在移動端瀏覽器開發一個能適應全部瀏覽器的網頁難度很是之高。此外能在PC電腦上顯示的網頁也許能夠適應像pad上的瀏覽器，可是到了智能手機上，這個網頁就不得不從新開發，從新開發倒無所謂，最要命的是就算從新開發，小屏幕的網頁很難囊括原來PC瀏覽器網頁全部功能，這和移動瀏覽器功能和屏幕過小所致，這樣的結果會致使商戶很難將用戶引流到移動端，從而喪失了移動互聯網的先機。
5. 瀏覽器的佈局技術在移動端瀏覽器技術普及上的做用是很關鍵的，在PC上開發網頁咱們常把佈局技術稱之爲html+css技術，其實在網頁排版裏圖片的做用是很是重要，而針對互聯網的web網站上圖片的份額更加多，並且經常會及時更新，圖片對於網絡流量昂貴的移動網絡而言就是人民幣，而瀏覽器是個公共的平臺，雖然咱們有不少技術手段可讓不少圖片緩存起來，可是平時運用裏重複加載圖片仍是屢見不鮮，而這樣的流量消耗就是在浪費人民幣，這點也一樣會成爲企業競爭的一個砝碼，因此使用APP會對老百姓更加實惠，也能讓商家表達更多對用戶的體貼。
6. 移動設備因爲屏幕較小，所以製做APP界面設計的複雜度比傳統PC電腦要小，這其實下降了必定的開發難度，並且APP開發的界面效果仍是比瀏覽器界面要好。此外桌面軟件開發自然就是響應式驅動，交互性比網頁更好，並且開發響應式應用的難度更低，因此使用APP開發的應用比傳統網頁更加吸引人。

　　由以上6點咱們能夠知道了，用戶在移動設備上忽視瀏覽器的緣由仍是移動瀏覽器的給予用戶的產品沒有APP好，孰好孰壞老百姓的內心都是雪亮雪亮的，老百姓是很聰明的，忽悠不到他們的。

　　在中國移動互聯網發展迅速，甚至已經開始擠壓PC端瀏覽器的份額，而移動設備是廣大用戶的首選，那麼這是否是說明web前端技術到了移動互聯網領域就會沒落了？爲了說明這個問題，我想談談爲啥在PC電腦上咱們會選擇瀏覽器開發商家應用，而不是爲商家專門開發個客戶端軟件呢？不少人說這點是商家出於成本考慮推進的，由於世界上操做系統不少，若是要作客戶端就得要爲每一個操做系統開發一個客戶端，就算是同一個操做系統，系統升級後客戶端就得有相應的更新，就算操做系統沒有升級，出於安全考慮不少客戶端也會常常升級，而瀏覽器則不一樣，開發一套網站就能夠打遍天下無敵手，能夠不用本身考慮客戶端升級的問題，其實用戶怕麻煩本性也幫助了這個潮流的發展。那麼這個理由在移動互聯網裏還有效嗎？

　　咱們看到的現象獲得的答案彷佛是無效的，由於移動互聯網下瀏覽器已經沒落了，更多人會選擇APP而非移動設備的瀏覽器，可是PC端瀏覽器大行其道的理由放到移動設備上，仔細掂量下仍是頗有市場的。

　　當今世界智能手機和平板電腦上流行兩大操做系統：蘋果公司的IOS和谷歌的android，雖然Android是一個獨立的操做系統，可是到了各個具體手機生產廠商，其手機上所使用android都會被或多或少的改寫，甚至有的公司能將其改的面目全非，在移動設備上操做系統的差別處理問題比PC操做系統要嚴重的多，畢竟我的PC電腦上微軟的windows操做系統仍是一家獨大，咱們只要知足了windows的客戶端，至少在中國就能知足90%以上的用戶需求了。APP就和PC電腦上的桌面軟件同樣，開發它須要調用大量的操做系統底層API，因此咱們想讓本身的應用覆蓋到大多數用戶就不得不爲每一個操做系統創建一個團隊，而這些團隊開發一樣的業務功能，只不過是使用的技術不一樣而已，結果會使得一個業務系統擁有多個不一樣版本，形成了人爲的系統異構性，這種異構對系統的運維也產生了很大的影響，不一樣的系統運維須要彼此獨立的運維團隊，這樣就增長了企業的成本壓力。

　　移動設備並無拋棄瀏覽器，瀏覽器的html、css以及javascript技術無論是那種移動操做系統上都是高度的一致，這種一致性甚至超過了PC電腦上不一樣廠商瀏覽器（移動瀏覽器基本都是webkit內核）的一致性，經過瀏覽器相關的開發技術消除平臺的差別在移動端任然是可取的，並且現實中移動端的平臺差別性問題的嚴重程度其實已經遠遠超出了PC平臺，其對公司形成的成本壓力也是不可言喻的，可是移動設備上瀏覽器的侷限性是一個很難跨越的鴻溝，那咱們有辦法解決這個問題，答案還真有，移動端操做系統將瀏覽器底層的接口都作成了API，咱們很容易將APP和瀏覽器技術結合在一塊兒，所以時下出現了phoneGap技術，phoneGap技術核心就是解決不一樣移動操做系統的差別性，使用phoneGap的技術人員能夠不多去考慮操做系統的兼容性問題，而只用關心瀏覽器技術就能夠開發出一套在IOS和android都能正常運行的APP，這套技術對於剛剛創業的小規模的互聯網公司很是有現實意義，惋惜爲了兼容不一樣操做系統，卻犧牲了應用的性能。

　　對於有實力的大公司又該如何選擇了，大公司的成本壓力會比小公司小不少，可是高企的成本也是一種潛在的風險，大公司面對這樣的問題，好的解決方案應該是減小重複性勞動，減輕運維壓力，其實時下大部分的APP都至關於一個自制的瀏覽器，只不過這個瀏覽器是帶有公司自有的業務，所以大公司的作法應該是將APP開發和瀏覽器開發分離開來，APP開發主要職責是作個框架，不過這個框架至關於新開發個瀏覽器，這點和java裏SSH框架有必定區別，而業務開發人員能夠只關心瀏覽器開發技術，用瀏覽器技術完成業務開發，至於到了業務運行階段，主要是業務開發人員的事情，這樣就避免了創建重複開發的技術人員團隊同時也達到了專業的人作專業的事情，運維也變得簡單多了，系統穩定性和健壯性也加強了，還有個最關鍵的好處那就是能夠複用原來的客戶端開發的技術人員，這是減輕人力成本的一個重要手段。

　　由此說來，web前端在移動互聯網領域並無沒落，並且移動互聯網會給web前端帶來大發展的機遇。

　　在移動互聯網時代web前端技術會變得愈來愈重要，比之前任什麼時候候都要重要。可是移動互聯網對web前端開發帶來了一個弊病，這個弊病就是web前端技術或許會變得愈來愈複雜。

　　首先無論哪一個移動端操做系統，瀏覽器的內核技術達到了史無前例的統一即大部分都是使用webkit內核，因爲移動互聯網沒有pc電腦的歷史負擔，移動端的瀏覽器一開始就支持了最新的html5，html5是顛覆性的技術，傳統的web前端開發人員要從新學習不少新的知識才能掌握它。

　　Html5技術提高了瀏覽器作富客戶端開發的能力，這種提高不是量的變化而是質的變化，html5讓web前端在整個web應用裏的做用提高到了史無前例的高度，富客戶端將會更加富有，咱們在移動互聯網裏開發web前端不能在那麼隨意了，而是須要將web前端技術更加框架化和工程化，那麼javascriptMVC技術會應用更加普遍，web先後端分離技術也將更加被人重視，到時若是有人再說web前端技術是一個玩具技術，那麼這人就等於還生活在互聯網的原始社會了。

　　移動互聯網對web前端技術影響或許還會致使一個新的職業方向的出現，這個方向就是客戶端工程師，雖然移動互聯網發展迅速，可是移動互聯網想徹底取代PC電腦，這種想法仍是很是不現實的，因此在很長時間裏傳統的互聯網和移動互聯網會並行發展，只不過咱們再去作互聯網系統客戶端這塊開發不只只要求知足PC瀏覽器了，也許公司但願能找到一個能幫忙解決全部客戶端的工程師，固然這種客戶端工程師應該會站在web前端技術之上來消除不過客戶端的差別性，不過到了解決移動互聯網客戶端問題時候，客戶端工程師或多或少都要了解到不一樣操做系統APP開發技術的細節，當web前端工程師進化爲客戶端工程師後，對那種web前端工程師和美工等同的偏見估計會更加沒有市場，新型的客戶端工程師須要掌握的技術門類更多，技術會更加全面，在加以富客戶端在web應用的重要度提高，客戶端工程師也許在整個互聯網行業會更加吃香。

　　移動互聯網的大發展致使當今這個時代作一個大型網站的成本愈來愈高了，由於咱們不得不去知足更多的客戶端。回到傳統的PC瀏覽器技術，做爲一名前端工程師我也感覺到最近幾年傳統的PC瀏覽器技術也在之前所未有的速度發展，就連噁心的微軟公司開發的ie瀏覽器也在發生着巨大的變化，版本發佈更加頻繁了。html5剛出來時候有不少朋友說這個東西不知道猴年馬月會流行，不要作深刻學習了，這個說法發生在兩年前，可是時下html5技術開始之前所未有的速度普及，不少人可能認爲這是瀏覽器廠商的驅動的，可是我確認爲根本緣由仍是移動互聯網上html5的普及間接影響到了PC瀏覽器的發展，移動互聯網的普及擠壓了傳統PC電腦的部分生存空間，迫使那些原來依仗本身壟斷地位不肯改變的廠商發生了變化。

　　移動互聯網的普及對互聯網服務端系統架構也會產生很大的影響，對於這個影響的思考仍是源自於有一天和一個即將畢業的大學生的聊天，那天他問我本身究竟是作web前端開發仍是作移動開發好，當時咱們簡單聊了下兩種技術的差別，他以爲客戶端技術之間的差別太大，更新太快，他彷佛對這種不可控性感到有點懼怕，如是他又問我：移動端對應的服務端技術和PC瀏覽器所對應的服務端技術是否是同樣的，個人回答固然是同樣的，因此最後他以爲本身仍是從事服務端開發比較好。

　　當我寫這篇文章時候讓我想起了此次聊天，我有個很大的疑問那就是客戶端的不一樣會對服務端的技術實現產生影響嗎？把這個疑問放的再大點，客戶端的不一樣會對咱們整個web系統架構，無論是web前端架構仍是web服務端架構會產生重大影響嗎？

　　我前面說到最棒的APP應該是APP技術和瀏覽器技術結合，可是APP和服務端的數據交互真的能夠所有有瀏覽器技術完成嗎？若是某些請求不得不用socket完成，那麼這種交互模式就和傳統PC的web的服務端發生了變化，假如這種狀況不少，那麼咱們就不得不單獨開發一套針對移動端的服務端程序。就算上面的問題不是問題，小屏幕和大屏幕所能容納的信息量是不一樣的，在PC上有些交互一個http請求就能夠完成，可是到了移動端可能不得不拆分紅多個請求協同完成，這樣的差別也會致使PC端的服務端不能複用，若是這樣的差別很大，咱們仍是不得不從新開發一套服務端，這麼說來就算服務端技術線路一致，例如都是使用我十分擅長的java，但現實咱們仍是不得不作不少重複勞動，若是沒有移動互聯網時候，領導讓咱們開發一個新網站給咱們兩個月時間就能完成，那麼如今開發一個新網站，人力資源不變的前提下，兩個月咱們能完成任務嗎？到時這樣的結果必定是老闆和員工一塊兒痛苦了。假如咱們真的爲不一樣客戶端對應開發一套新的服務端程序，這作法就比如洪水來了咱們趕忙修河堤，洪水越大，咱們的河堤就作的越高，最後大河成了天河，那天河堤出了點紕漏頗有可能大堤潰壩，後果很是嚴重，治理洪水最好的解決方案應該是咱們如何疏導洪水，那麼在軟件領域這種疏導最後是從新審視咱們網站系統的總體架構，在架構設計層面就考慮到方方面面，從架構上重構系統每每會達到事半功倍的效果。

　　其實從服務端角度而言，按MVC架構思想考慮，客戶端不一樣影響到的是V層和C層即視圖層和控制層，對於服務端而言就是控制層了，那麼要減輕服務端改造壓力，咱們必需要將服務端的控制層和模型層解耦的更加完全，最好的方式就是採用分佈式技術，控制層和模型層變成兩個獨立的系統，兩個系統通信就採用我之前講到的高效遠程調用的方式，遠程調用使用起來和本地調用差很少，這樣也減輕了服務端技術變遷的壓力。服務端的控制層和客戶端的關係太過密切，雖然控制層聽起來很高大上，但在作開發時候控制層的發言權實在是小的可憐，因此這裏我想先講講視圖層即客戶端的改變，無論移動端是怎樣的APP，也無論開發移動APP的技術有多好，我相信移動端的APP必定是一個強有力的富客戶端，這點到了PC上的瀏覽器客戶端就有很大的不一樣，雖然當今ajax技術深刻人心，可是想在pc瀏覽器上寫出強大的富客戶端是有必定難度的，並且現實下不少pc瀏覽器端的程序都是很是不健壯和書寫隨意，這主要web前端技術精通門檻較高，還有大量小公司對web前端技術的重視度不夠所致，這樣的現狀就更不要說讓本身的web前端達到javascriptMVC的程度，因此我以爲咱們要對pc瀏覽器端的程序進行重構，將pc端的前端作成javascriptMVC模式，那麼javascriptMVC的客戶端就變成了SOA裏的一個服務了，它和控制層的交互就能夠像SOA架構裏不一樣系統調用那樣，定義好服務接口報文格式便可，這種作法也很是適合APP，由於APP開發時候也只是在須要服務端數據時候纔會交互，而大部分頁面展現均可以在客戶端本地完成，例如咱們可讓全部的服務端數據交互都已json格式進行，那麼若是客戶端請求數據有變化咱們頂多就是增長個新接口就行，PC端能被複用到移動端的接口仍是能夠照用不誤。

　　我相信web前端技術不會沒落的，它只會愈來愈重要，若是有一天互聯網開發裏真的出現了客戶端工程師，那也是web前端技術的昇華，web前端會愈來愈專業，要求的技能會愈來愈高，記得我4年前我打算往web前端發展時候，我曾經碰到不少技術難題，當我找到解答時候發現不少解答卻帶來了更多疑問，疑問源自解答裏依賴於瀏覽器內核的解釋，如是我在一些技術羣裏詢問相關瀏覽器內核的資料，某個羣裏有位朋友跟我這麼說研究瀏覽器內核有啥用，那是老美作的事情，在中國研究這個一點前途都沒有，只要會用就好了，「不要沒事找抽，自找麻煩」，引號差很少是原話了，而前不久我在京東上買到一本講解webkit內核的書籍，爲了之後看懂他，我最近一段時間重溫了不少web前端的技術，看看如今的招聘，不少公司都開始大規模招聘瞭解瀏覽器內核的人才，這件事情讓我有點感慨，學習雖然最終都是爲了達到某種功利心，可是要學好東西，必定得要報着解決本身疑問的目的，不畏艱險，而不要過多去考慮如今這個有用如否。

　　好了，文章寫畢，祝你們晚安。