前端開發(fā)在最近幾年逐漸走紅，越來越多的開發(fā)者加入前端開發(fā)隊(duì)伍劣纲。但前端在大學(xué)中沒有課程體系谦炒，而且知識也在不斷更新著。大家對它的認(rèn)識也各不相同武福。博主有過技術(shù)經(jīng)理胆剧，項(xiàng)目經(jīng)理粱侣，面試官饭玲，前端開發(fā)的經(jīng)歷，參與過較多的前端開發(fā)項(xiàng)目叁执，也結(jié)識了較多前端開發(fā)人員茄厘“基于這些因素我對前端有些較深刻的認(rèn)識，和大家分享下次哈。
本文取名七宗罪是有些噱頭之意胎署，還請大家見諒，實(shí)則想為大家闡述前端開發(fā)的誤區(qū)窑滞。
罪一：前端只是JS
有這么一部分朋友琼牧，只看犀牛書（《JavaScript權(quán)威指南》），每天研究JS這JS那的哀卫，認(rèn)為這樣就算是前端開發(fā)了巨坊。
但我要說的是：前端不只是JS。
何謂前端開發(fā)此改？我認(rèn)為趾撵，一切以展現(xiàn)為目標(biāo)的工作，都是前端開發(fā)工作共啃。在前端開發(fā)中占调，除了JS，還有很多需要去掌握的移剪，比如瀏覽器原理究珊，html5,css3等。之前在面試別人時(shí)纵苛，問他剿涮，怎么做一個(gè)觸摸屏上的轉(zhuǎn)盤。他搖頭赶站。我退了一步幔虏，和他說談?wù)勀愕南敕ㄒ部伞Ｋ肓艘幌卤创唬€是不會想括。
做轉(zhuǎn)盤，是我經(jīng)常面別人的一道題（我在后期會對這道題給大家解說）烙博，看似簡單瑟蜈，但代表了前端知識的綜合應(yīng)用。你沒有觸摸屏開發(fā)經(jīng)驗(yàn)渣窜，不知道CSS3或canvas铺根，不了解網(wǎng)頁優(yōu)化，是做不出來的乔宿。前端是綜合技術(shù)的應(yīng)用位迂，只會JS是解決不了問題的。
罪二：我現(xiàn)在能HOLD住一切，不用學(xué)新東西了
我面過的人中掂林，有60%的人沒有h5和CSS3的實(shí)際工作經(jīng)驗(yàn)臣缀，甚至只聽過一些名詞，沒有研究過泻帮。問他們原因精置，大部分回答之前的工作用不上，小部分回答沒時(shí)間锣杂。當(dāng)問到一些動畫的實(shí)現(xiàn)時(shí)脂倦，有部分面試者還在用頻繁改DOM的CSS2屬性來實(shí)現(xiàn)。
這種狀況的原因可能和工作內(nèi)容有關(guān)元莫，目前國內(nèi)的一些移動端網(wǎng)頁還是比較中規(guī)中矩的赖阻，產(chǎn)品經(jīng)理對前端實(shí)現(xiàn)很少有非常規(guī)的要求。一些前端開發(fā)者的任務(wù)是把后端的數(shù)據(jù)給呈現(xiàn)出來即可柒竞，這些確實(shí)CSS2也能實(shí)現(xiàn)政供。但這些也不是不學(xué)不用新技術(shù)的理由，啃老本總有一天被淘汰朽基。讓頁面的用戶體驗(yàn)更好布隔，是前端的責(zé)任。
罪三：前端不需要了解后端知識
也是稼虎，前端好好的弄前端唄衅檀，管后端干嘛。
但行業(yè)在發(fā)展著霎俩，前端的功能越來越強(qiáng)大哀军。離線數(shù)據(jù)庫能提供數(shù)據(jù)存儲和管理的功能，但不會寫SQL語句能玩得轉(zhuǎn)嗎打却？WebSocket能提供即時(shí)通信杉适，但不了解socket和WebSocket的區(qū)別，能和后端開發(fā)(很多后端開發(fā)只會socket技術(shù))一起搭建嗎? 加快頁面展示速度不只是要從前端分析柳击，后端也要考慮到猿推，使用keep alive、 緩存等后端技術(shù)能使頁面更快地打開捌肴。
罪四：設(shè)計(jì)師或產(chǎn)品經(jīng)理太異想天開了蹬叭，他們要的好難實(shí)現(xiàn)呀，干脆回復(fù)實(shí)現(xiàn)不了吧
不要排斥他們的非常規(guī)需求状知，他們的這些奇怪需求也許會成為企業(yè)的重要競爭力秽五。（好吧，這一點(diǎn)切換到公司經(jīng)營者的視角了饥悴。）用戶越來越注重表現(xiàn)效果了坦喘，不要再以簡單的列表頁和詳情頁來打發(fā)用戶了盲再，他們可能會因?yàn)榱己玫挠脩趔w驗(yàn)而成為網(wǎng)站的忠實(shí)用戶。遇到非常規(guī)需求時(shí)瓣铣，首先想下怎么運(yùn)用前端知識來實(shí)現(xiàn)洲胖，如果想不出來，就和同行討論下坯沪。總之擒滑，實(shí)現(xiàn)需求是開發(fā)者的責(zé)任腐晾，不要輕易說這個(gè)需求我們實(shí)現(xiàn)不了。
罪五：不考慮極端情況或性能丐一，頁面出來就行
大部分前端呈現(xiàn)使用DOM,但DOM用得多了會有性能問題≡逄牵現(xiàn)在很流行列表頁頁底上拉加載更多，但很少有前端關(guān)注加載的極端問題库车，如果一個(gè)頁面我下拉了很多次巨柒，加載了幾千個(gè)DOM，會發(fā)生什么問題柠衍？答案是輕則頁面響應(yīng)緩慢洋满，重則瀏覽器閃退。
另外舉個(gè)例子：LocalStorage使用起來確實(shí)方便珍坊，很多企業(yè)的前端重度依賴它牺勾，甚至知名的前端開發(fā)框架也依賴它。但它有個(gè)缺點(diǎn)——有容量限制（2.6M-10M）阵漏，我們得考慮極端情況驻民，當(dāng)LocalStorage空間快滿時(shí)，怎么處理履怯』鼗梗或在架構(gòu)上避免這種極端情況的發(fā)生。
罪六：頁面只是給用戶看的叹洲，用戶能正常使用就行
來看你頁面的柠硕，不只是用戶，還有機(jī)器人疹味。
Web App一直在覬覦Native App的位置仅叫，有的Web App和Native App 根本看不出差別。Web App大紅大紫糙捺，各種前端MVC框架也風(fēng)聲水起诫咱，但它們都有個(gè)問題，幾乎沒法做SEO洪灯，因?yàn)樗阉饕鏌o視JS坎缭。流量是企業(yè)的立命之本竟痰，SEO做得好能引來大量的流量，所以前端還是得考慮SEO問題掏呼。（會在后面和大家討論Web App的SEO方案）
罪七：不使用/不推動 新技術(shù)
上帝給了你一雙翅膀,你卻把它給烤了坏快。
問自己幾個(gè)問題，網(wǎng)頁用了CSS3動畫嗎憎夷？網(wǎng)頁支持多點(diǎn)觸摸操作嗎莽鸿？距離感應(yīng)器，動作感應(yīng)器拾给，你用了沒有祥得？這里并不是說為了用而用這些新技術(shù)。而是想表明蒋得，我們已經(jīng)有新的技術(shù)了级及，不要把它們浪費(fèi)了，是時(shí)候?qū)σ郧暗木W(wǎng)頁和以前的操作方式進(jìn)行變革了额衙。使用這些特性饮焦，能讓用戶體驗(yàn)更佳。一些產(chǎn)品經(jīng)理或設(shè)計(jì)師對前端的認(rèn)識還停留在html4時(shí)代窍侧，我們有必要和他們科普一下新知識县踢。
