成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

我的前端開發(fā)準(zhǔn)則

khs1994 / 774人閱讀

摘要：轉(zhuǎn)眼入行一年半，在前端這條路上摸爬滾打，學(xué)海無涯，生命不息，不止。再次說明，這是我的準(zhǔn)則，里面有精華也有糟粕，如果有熱心人能指點一二，感激之情，不勝言表。站點內(nèi)部的，每次發(fā)布上線之前必須使用壓縮合并。

轉(zhuǎn)眼入行一年半，在前端這條路上摸爬滾打，學(xué)海無涯，生命不息，code不止。回頭看自己今年寫的代碼，依然慘不忍睹，留坑無數(shù)。很多道理都是在不停的寫之中才想明白的。只是工作不會給我們時間回頭去改翔一般的代碼，我能做的，就是在接下來的過程中不再去犯同樣的錯誤。希望我寫的這點筆墨能讓剛?cè)胄械耐瑢W(xué)少走一個彎路。

再次說明，這是我的準(zhǔn)則，里面有精華也有糟粕，如果有熱心人能指點一二，感激之情，不勝言表。

關(guān)于圖片

頁面內(nèi)的大圖，特別是banner圖，登錄頁背景圖等，使用第三方的cdn加速。同時做一遍壓縮，如果壓縮之后還超過200kb，則和設(shè)計師溝通是否取消或者更換圖片。

精靈圖必備，各種小圖標(biāo)，小icon，做到一張圖片里面去。

盡量使用icon font代替小圖標(biāo)，icon font的優(yōu)點可以甩普通的icon圖標(biāo)幾條街，隨意調(diào)整大小，改變顏色，太cool??！

如果項目很大，公司不差錢，最佳方案是把圖片資源放在多帶帶的服務(wù)器上，配置獨立的域名，圖片資源的加載由圖片域名加載，很多大公司的靜態(tài)資源都是由獨立的服務(wù)器來存放和分發(fā)的

我一般和設(shè)計師討價還價的底線就是圖片必須加載流暢，如果用戶打開網(wǎng)頁圖片加載半天出不來，就算我們的圖片做的再漂亮，又有什么卵用??！


良心資源：阿里巴巴字體圖標(biāo)庫
關(guān)于js

第三方的js庫，必須使用min版。站點內(nèi)部的lib，每次發(fā)布上線之前必須使用gulp壓縮合并。

移動端使用zepto庫，不允許使用jquery

給js代碼一個全局命名空間，舉個例子，我們的項目是某個自行車官網(wǎng)，全局命名空間就叫bike，和本項目有關(guān)的所有js方法，函數(shù)，變量，全部掛在bike的下面

var bike={};
bike.name="cookee";
bike.getOrderDetail=functtion(id){.....}
關(guān)于css

提煉項目的公共樣式，按鈕、表單。

命名。面向?qū)傩悦ㄓ媚K可以面向模塊命名，比如頭部header，尾部footer等，其他請盡量使用面向?qū)傩缘拿绞?，這樣可以給css最大程度的復(fù)用自由，關(guān)于什么是面向?qū)傩缘拿绞?，請參考推薦

樣式分離再分離，在css里面不要使用id屬性，留著id給js使用

減少css的層級嵌套，由于css的渲染是從右向左的，關(guān)于網(wǎng)頁的渲染，這個細(xì)說起來又可以寫一篇文章了。如果你的層級標(biāo)簽嵌套多層，想想要浪費多少渲染時間，對于移動端毫秒必爭的加載時間，你還有什么理由不改進你的代碼

優(yōu)雅的名字可以讓人一目了然，放一張前人總結(jié)的圖，沒事的時候多看看，潛移默化的記住這些名字

精簡高效的CSS命名準(zhǔn)則/方法
關(guān)于html

精簡dom結(jié)構(gòu)，減少冗余html

語義化標(biāo)簽，要學(xué)會用

移動端，使用svg繪圖代替canvas繪圖，canvas會有嚴(yán)重的鋸齒(如果有同學(xué)有實踐過的解決鋸齒的方案，我愿恭聽)

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/78300.html

相關(guān)文章

  • 我的前端開發(fā)準(zhǔn)則

    摘要：轉(zhuǎn)眼入行一年半，在前端這條路上摸爬滾打，學(xué)海無涯，生命不息，不止。再次說明，這是我的準(zhǔn)則，里面有精華也有糟粕，如果有熱心人能指點一二，感激之情，不勝言表。站點內(nèi)部的，每次發(fā)布上線之前必須使用壓縮合并。 轉(zhuǎn)眼入行一年半，在前端這條路上摸爬滾打，學(xué)海無涯，生命不息，code不止?；仡^看自己今年寫的代碼，依然慘不忍睹，留坑無數(shù)。很多道理都是在不停的寫之中才想明白的。只是工作不會給我們時間回頭...

    Andrman 評論0 收藏0

  • 我的前端開發(fā)準(zhǔn)則

    摘要：轉(zhuǎn)眼入行一年半，在前端這條路上摸爬滾打，學(xué)海無涯，生命不息，不止。再次說明，這是我的準(zhǔn)則，里面有精華也有糟粕，如果有熱心人能指點一二，感激之情，不勝言表。站點內(nèi)部的，每次發(fā)布上線之前必須使用壓縮合并。 轉(zhuǎn)眼入行一年半，在前端這條路上摸爬滾打，學(xué)海無涯，生命不息，code不止?；仡^看自己今年寫的代碼，依然慘不忍睹，留坑無數(shù)。很多道理都是在不停的寫之中才想明白的。只是工作不會給我們時間回頭...

    AlphaWallet 評論0 收藏0

  • 我的前端編碼習(xí)慣 —— html篇

    摘要：標(biāo)簽屬性屬性名全部寫，屬性值雙引號引起來，每個雙標(biāo)簽務(wù)必加對應(yīng)的結(jié)束標(biāo)簽單標(biāo)簽不遵循此標(biāo)準(zhǔn)，仍按原標(biāo)準(zhǔn)，即不需要以結(jié)束。視情況為鏈接添加，圖要添加及。明確指定圖的和。 前言 作為一個前端工程師，我們可能每天都要寫html、css、javascript，每個人寫出來的代碼都飽含著自己的個人的style也有自己的編碼習(xí)慣和準(zhǔn)則，下面和大家分享一下我的習(xí)慣和準(zhǔn)則。 html 首先我們要對文...

    darkbug 評論0 收藏0

  • 我的前端編碼習(xí)慣 —— html篇

    摘要：標(biāo)簽屬性屬性名全部寫，屬性值雙引號引起來，每個雙標(biāo)簽務(wù)必加對應(yīng)的結(jié)束標(biāo)簽單標(biāo)簽不遵循此標(biāo)準(zhǔn)，仍按原標(biāo)準(zhǔn)，即不需要以結(jié)束。視情況為鏈接添加，圖要添加及。明確指定圖的和。 前言 作為一個前端工程師，我們可能每天都要寫html、css、javascript，每個人寫出來的代碼都飽含著自己的個人的style也有自己的編碼習(xí)慣和準(zhǔn)則，下面和大家分享一下我的習(xí)慣和準(zhǔn)則。 html 首先我們要對文...

    ernest.wang 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<