前端技術 - 收藏集 - 掘金

一勞永逸的搞定 flex 佈局 - 掘金
尋根溯源話佈局 一切都始於這樣一個問題：怎樣經過 CSS 簡單而優雅的實現水平、垂直同時居中。記得剛開始學習 CSS 的時候，看到 float 屬性不禁得感受眼前一亮，瓜熟蒂落的聯想到 Word 文檔排版中用到的的左對齊、右對齊和居中對齊，然而很快就失望的發現...

JavaScript 常見設計模式解析 - 掘金
設計模式（Design pattern）是一套被反覆使用、多數人知曉的、通過分類編目的、代碼設計經驗的總結。使用設計模式是爲了可重用代碼、讓代碼更容易被他人理解、保證代碼可靠性。毫無疑問，設計模式於己於他人於系統都是多贏的；設計模式使代碼編寫真正工程化；設計模...

[淺析前端頁面渲染機制

• 前端 - 掘金](https://juejin.im/entry/58f43...
  做爲一個前端開發，最多見的運行環境應該是瀏覽器吧，爲了更好的經過瀏覽器把優秀的產品帶給用戶，也爲了更好的發展本身的前端職業之路，有必要了解從咱們在瀏覽器地址欄輸入網址到看到頁面這期間瀏覽器是如何進行工做的,進而瞭解如何更好的優化實踐，本篇主要圍繞這兩點展開闡述...

30 分鐘搞定 ES6 經常使用基礎知識 - 前端 - 掘金
ES6基礎智商劃重點 在實際開發中，ES6已經很是普及了。掌握ES6的知識變成了一種必須。儘管咱們在使用時仍然須要通過babel編譯。 ES6完全改變了前端的編碼風格，能夠說對於前端的影...

濃縮的纔是精華：淺析GIF格式圖片的存儲和壓縮 - 掘金
騰訊雲技術社區-掘金主頁持續爲你們呈現雲計算技術文章，歡迎你們關注！ 做者：成文迪， 在Web前端摸爬滾打的碼農一枚，對技術充滿熱情的菜鳥，致力爲手Q的建設添磚加瓦。 GIF格式的歷史 GIF(Graphics Interchange Format)原義...

如何使用一個js文件去管理項目所用的js - 前端 - 掘金
前言 隨着項目功能愈來愈完善，js文件多了又多，如何經過一個init.js去管理項目所須要的js（重點：解決js文件順序加載的問題），本文章爲你揭祕。 踩坑 當前的項目情況 a.html使用的js部分 <script type="text/javas...

移動端 H5 頁面注意事項 - 掘金

1. 單個頁面內容不能過多 設計經常使用尺寸：750 x 1334 / 640 x 1134，包含了手機頂部信號欄的高度。 移動端H5活動頁面經常須要可以分享到各類社交App中，經常使用的有 微信、QQ 等。 使用移動設備查看頁面時會發現，在微信瀏覽器中有 頂部導航欄...

前端進階：透徹掌握 Promise 的使用，讀這篇就夠了 - 前端 - 掘金
Promise：高手必備 Promise的重要性我認爲我沒有必要多講，歸納起來講就是必須得掌握，並且還要掌握透徹。這篇文章的開頭，主要跟你們分析一下，爲何會有Promise出現。 在實...

2016 年崛起的 JS 項目 - 掘金
本文是我對中文版 risingstars2016 的整理，而本人就是中文版的譯者，首發於知乎專欄 前端週刊。共 21384 字，讀完需 30 分鐘，速讀需 5 分鐘。長江後浪推前浪，若是你能花 30 分鐘讀完我 6 個小時翻譯的內容，相信你不會...

HTML 不能這麼寫、你造嗎？ - 前端 - 掘金
目錄 a標籤不能夠嵌套交互式元素 塊級元素能夠包含內聯元素和某些塊級元素，內聯元素不能包含塊級元素，只能包含內聯元素 p標籤不能包含塊級元素 ...

詳解 Javascript十大經常使用設計模式 - 前端 - 掘金
一：理解工廠模式    工廠模式相似於現實生活中的工廠能夠產生大量類似的商品，去作一樣的事情，實現一樣的效果;這時候須要使用工廠模式。    簡單的工廠模式能夠理解爲解決多個類似的問題;這也是她的優勢;好比以下代碼：&...

騰訊 2016 公司代碼報告前端開發總結 - 前端 - 掘金
2016年騰訊公司代碼報告已經正式發佈，記錄下開發過程當中遇到的問題，以及一些使用過的東西。查看請微信掃碼： 騰訊2016公司代碼報告前端篇 ...

WebRTC 直播時代 - 前端 - 掘金
WebRTC 全稱爲：Web Real-Time Communication。它是爲了解決 Web 端沒法捕獲音視頻的能力，而且提供了 peer-to-peer（就是瀏覽器間）的視頻交互。實際上，細分看來，它包含三個部分： ...

HTML 大文件上傳 - 前端 - 掘金
文件上傳已經是老生常談了。文件上傳，原始的方法有： form表單提交。 經過iframe+form表單進行模擬異步上傳。 因爲Http協議的限制，在處理大文件上傳會存在超時的現象。在舊的瀏覽器中是沒法讀...

javascript array js 緩存算法，數組去重、數組隨機抽取、字母串轉數字，數字轉字符串 - 前端 - 掘金
前言 由於平時在寫代碼的過程當中，有些算法會常常重複寫，好比數組去重、數組抽取隨機值等！雖然這些不是很難的邏輯，可是每次剛開始遇到需求的時候，仍是須要琢磨一些時間才能想出來，因此此文檔把這些常見算法的思想記錄下...

前端基礎進階：詳細圖解，完全搞懂閉包與做用域鏈 - 前端 - 掘金
攻克閉包難題 初學JavaScript的時候，我在學習閉包上，走了不少彎路。而此次從新回過頭來對基礎知識進行梳理，要講清楚閉包，也是一個很是大的挑戰。 閉包有多重...

不按期更新 JavaScript 技巧 - 前端 - 掘金
 JavaScript技巧，偶爾更新。 計算數組的極值 function smallest(array){ return Math.min.apply...

H5 項目常見問題彙總及解決方案 - 前端 - 掘金
轉自 https://github.com/FrontEndZQ... H5項目常見問題及注意事項 Meta基礎知識： H5頁面窗口自動調整到設備寬度，並禁止用戶縮放頁面 //1、HTML頁面結構...

前端工程化開發方案 app-proto - 前端 - 掘金
什麼是前端工程化？根據具體的業務特色，將前端的開發流程、技術、工具、經驗等規範化、標準化就是前端工程化。它的目的是讓前端開發可以「自成體系」，最大程度地提升前端工程師的開發效率，下降技術選型、先後端聯調等帶來的協調溝通成本。 美團點評廈門智能住宿前端研發團隊通...

再學一次 sea.js - 前端 - 掘金
遇到的問題 只要你是前端，你確定寫過或者見過下面代碼。<scrpit type="text/javascr...

Vonic 正式版發佈！附中文文檔 - 前端 - 掘金
成功收尾，本月終於能夠向 2.0 邁進了！O(∩_∩)O...

canvas 圖片問題淺析 - 前端 - 掘金
問題 Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may...

京東 2016 版首頁改版前端總結 - 前端 - 掘金
深圳的天氣老是多變，前一段時間仍是涼意濃濃，彷佛要步入冬天了，最近卻又變得炎熱起來，氣溫驟升，讓人措手不及。正如咱們負責的業務同樣，一年下來有諸多變化。今年9月份咱們接手了京東2016版首頁改版開發，歷經1個多月緊張地開發測試，終於在雙11前成功全量發佈，回想...

Anime.js：輕巧的 JavaScript 動畫庫 - 前端 - 掘金
摘要：我最喜歡的動畫庫之一，就是Anime.js，它是一個徹底免費、開源的JavaScript動畫庫。這個庫有着豐富的功能，它是針對JavaScript所開發的，並且它同時也很是依賴CSS動畫。你能夠在DOM中將其與用在單一的頁面元素之上，你也能夠將其用在個性...

gulp & webpack整合，魚與熊掌我都要！ - 前端 - 掘金
爲何須要前端工程化？ 前段工程化的意義在於讓前端這個行業由野蠻時代進化爲正規軍時代，近年來不少相關的工具和概念誕生。好奇心日報在進行前端工程化的過程當中，主要的挑戰在於解決以下問題： 若是管理多個項目的前端代碼？ 如何同步修改複用代碼？ 如何讓開發體驗更爽？...

動手實踐用 Gulp+Webpack 構建純前端 React 應用 - 前端 - 掘金
最近構思了一個練手項目，應用react實現程序的邏輯，從而進一步學習React框架開發。此次的例子是一個純前端的簡單應用，模擬實現圖片上傳和展現功能。應用中，使用sessionStorage存儲圖片數據，而且將sessionStorage中存儲的圖片數據，以列...

rem 佈局初步實踐 - 前端 - 掘金
先說結論 實用而論，不想了解具體原理的同窗只要記住一點便可：在配置好環境的狀況下，拿到設計稿並發現須要使用固定寬高比元素的時候，在css中作好px（設計稿中的px）與rem換算就行（即使這個過程也有很多偷懶的辦法,減輕工做量）. 關於rem的基礎知識 這部分比...

淺談CSS3多列布局 - 掘金
相信你們都看過報紙，報紙上的內容大多數都是分欄顯示的，以下圖所示： 對於前端攻城獅來講，這種分列布局，在之前雖然能夠實現，但是難度倒是不小，工做量很大，必須使用JavaScript對內容分段，再配合上絕對定位或浮動等CSS樣式來實現多列布局。但如今，強大的CS...

這裏有超過20家的前端面試題，你肯定不點進來看看？ - 掘金
0.備註 若文章中部份內容沒法顯示，請移步李鵬的其餘博客。 簡書 CSDN ## 1. 前言 這裏有超過20家的前端面試題，你肯定不點進來看看？ 好吧，若是你看到這句話，你明顯是點進來了。 那麼恭喜你，接下來我就和大家分享一下，近期我收集到的各個公司...

奇虎360 Web 前端開發工程師面試題 - 前端 - 掘金
最近有幸參加了一次360的面試，下面把面試題總結記錄一下： 一面 JS 1.下面代碼的輸出值是？ alert(1&&2); 2.正則表達式匹配，開頭爲11N, 12N或1NNN，後面是-7-8個數字的電話號碼。 3.寫出下面代碼的輸...

Ajax 知識體系大梳理 - 掘金
這是一篇萬字長文, 系統梳理了ajax相關的知識體系, 幾乎囊括了全部ajax的知識點. 原文: http://louiszhai.github.io/20... 導讀 Ajax 全稱 Asynchronous JavaScript an...

Angular2 + node 接口調試解決方案 - 前端 - 掘金
事情的原由 因爲最近在使用Angular + node開發，採起的辦法一直都是約定好接口，而後node實現，再編寫前端。可是這樣有一個很麻煩的問題：編寫前端的時候沒法調用接口，不能很好地測試，只能一口氣寫完再編譯後放到後端來測試...

Vuex 入門 demo（不依賴 webpack 使用） - 前端 - 掘金
Vuex 入門 demo（不依賴 webpack 使用）...

跟着寫一個 CSS 柵格佈局 - 前端 - 掘金
咱們常在諸如Bootstrap的前端框架中見到css柵格系統，若是僅僅爲了使用柵格佈局而引入一個前端框架是很不明智的行爲。因此，這篇文章就是幫助你從零打造一個CSS Grids～ 什麼是柵格系統 柵格系統（CSS Grids）是一種運...

webpack 2.2 中文文檔，翻譯的很好，看完就學會了 webpack - 前端 - 掘金
正如咱們在介紹中提到的，在 webpack 配置中有多種方式定義 entry 屬性。除了解釋爲何它可能的用途，咱們還將向你展現如何去配置 entry 屬性。 單個入口（簡寫）語法 用法：entry: string|Array&...

vue 上傳圖片預覽以及刪除組件 - 前端 - 掘金
上傳圖片預覽以及刪除的vue組件 git clone 到本地，打開 index.html 就能夠了...

前端知識體系 知識結構 - 提綱版 - 前端 - 掘金
綜合類 前端知識體系 前端知識結構 Web前端開發大系概覽 Web前端開發大系概覽-中文版 ...

響應式圖片實戰 - 前端 - 掘金
說到響應式網站，咱們都知道彈性佈局、彈性圖片、媒體查詢，更多指的是佈局的方式，好比說使用max-width: 100%，這樣讓圖片的寬度隨着容器的大小而改變，響應式設計讓網站能兼容各類屏幕設備，可是在咱們流量這麼昂貴的時代，讓一個小屏幕的手機去加載一張爲大屏幕...

百度地圖 API 標註 + 時間軸組件 - 前端 - 掘金
工做時被要求到的,結合百度地圖api作一個動態展現標註變化的組件,要求地圖展現某一天的標註,時間軸要求能夠動態播放每一天的標註變化...而後我就開始coding... 準備工做: ...

多頁架構的先後端分離方案（webpack+express） - 前端 - 掘金
SPA（單頁架構）方案當下雖然很時髦，不過大多數的網站依舊選擇多頁或者單頁+多頁的混合架構。使用 express, webpack 本文低成本的實現了包含多頁架構，自動刷新，先後端分離 等概念 ...

基於 Vue2.0 高仿微信 App - 前端 - 掘金
利用Vue2.0模仿微信app，努力作到以假亂真的效果。我的獨立開發，源碼中有詳細的註釋，爲新手提供許多有用的提示信息。後期會增長 仿3DTouch、登錄、註冊、emoji表情內嵌、朋友圈圖片查看等功能，讓它更接近微信App的用戶交互體驗。 ...

HTML 不能這麼寫、你造嗎？ - 前端 - 掘金
目錄 a標籤不能夠嵌套交互式元素 塊級元素能夠包含內聯元素和某些塊級元素，內聯元素不能包含塊級元素，只能包含內聯元素 p標籤不能包含塊級元素 ...

寫給前端的甩鍋指南 - 前端 - 掘金
前端小白，「老王，你的接口不能用了」 後端老王一臉不屑，「怎麼可能，剛剛還能用，你看看參數傳對了沒有。」 前端小白吭哧吭哧檢查了幾遍，「參數沒問題啊，你看看是否是有 username, id。。。」 後端老王頓了許久， 「參數應該沒問題，你再清下瀏覽器緩...

美團智能支付背後的前端工程師 - 掘金
做者：任遠，前後就任於騰訊、人人、小米，現美團智能支付前端負責人，負責十多個前端業務線、技術線的開發和管理工做，手下精兵強將，人才輩出，技術涉獵很是普遍，覆蓋移動端、PC端、hybrid端、Node數據中間層相關的大前端技術，對於項目的完整開發運做有很是豐富的...

記錄一些前端的知識點 (一) - 前端 - 掘金
想學習前端或編程知識歡迎關注專欄：敲代碼，學編程 - 知乎專欄1、W3C 標準盒模型和 IE 盒模型區別：1. W3C 標準盒模型：盒子的高寬是由盒子的內容區僅由 width, height 決定的，不包含邊框，內外邊距。2. IE 盒模型：在 IE 盒模型中...

前端常見算法的 JS 實現 - 前端 - 掘金
原文連接 排序算法 一、冒泡排序 function bubbleSort(arr){ var i = j = 0; for(i=1; i<arr.length; i+...

前端知識點大百科全書 - 前端 - 掘金
These share data are from my usual work and learning，hoping to help you，If you like you can star Javas...

「前端」rem 縮放方案 flexible-js 兼容 375px 方案的思路 - 掘金
本文來自尚妝前端團隊南洋 發表於尚妝github博客，歡迎訂閱。 移動端H5頁面rem縮放方案flexible.js兼容375px方案的思路 參考： 移動端高清、多屏適配方案 viewport-and-flexible.js flexible.js git...

響應式和自適應的區別 - 前端 - 掘金
玩前端也有幾個月了，發現你們廣泛混淆了響應式和自適應的概念。先給你們體驗一下響應式和自適應的區別，請放大縮小一下屏幕嘗試 自適應的體驗http://m.ctrip.com/html5/&nbs... 響應式的體驗 http://segmen...