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

資訊專(zhuān)欄INFORMATION COLUMN

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

Andrman / 1283人閱讀

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

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

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

關(guān)于圖片

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

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

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

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

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


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

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

移動(dòng)端使用zepto庫(kù)，不允許使用jquery

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

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

提煉項(xiàng)目的公共樣式，按鈕、表單。

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

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

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

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

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

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

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

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

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

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

相關(guān)文章

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

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

    khs1994 評(píng)論0 收藏0

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

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

    AlphaWallet 評(píng)論0 收藏0

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

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

    darkbug 評(píng)論0 收藏0

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

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

    ernest.wang 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<