原创 web前端中的單元測試和端對端測試

1.單元測試 todo 2.端對端測試 todo

原创 HTML5觸摸屏和移動設備事件

主要分爲三類:手勢(gesture),觸摸(touch)和屏幕旋轉(orientation) 手勢事件gesture 用於兩個手指之間的縮放與旋轉。 手勢生成時產生gesturestart,收拾過程是gesturechang

原创 webpack構建優化

壓縮Minimize 爲了最小化你的腳本(和你的css,如果你使用css-loader)webpack支持一個簡單的選項: --optimize-minimizeresp.new webpack.optimize.UglifyJ

原创 webpack要點

webpack是一個模塊打包工具(module bundle),它獲取所依賴的模塊,並生成這些模塊的靜態資源。支持的模塊系統有:commonJS,AMD,CMD,UMD,ES6。 loaders 模塊轉換 style-loade

原创 gulp學習總結

入門指南 1.全局安裝 gulp: $ npm install --global gulp 2.在項目中安裝gulp: $ npm install --save-dev gulp 3.準備gulpfile.js文件: var

原创 自制操作系統第一天

30天自制操作系統 二進制編輯器 操作系統的啓動 BIOS通電,加載硬盤的引導扇區,引導扇區是磁盤的第一個扇區,一個扇區的大小是512 字節,如果第一個扇區最後兩個字節是0x55AA, 彙編指令 DB: define byte,

原创 Grunt使用初步

1.快速入門 1)Grunt Cli 要在命令行中使用grunt,必須先將grunt-cli先安裝到全局環境中: npm install -g grunt-cli (要使用npm,請先安裝node,如未安裝,請自行安裝) g

原创 ECMASCRIPT 5新特性

Object.create(prototype, descriptors) 以指定的原型創建對象,並且可以(可選)的設置對象的屬性 Object.defineProperty(object, propertyname, des

原创 編寫一個webpack插件

插件將Webpack引擎的全部潛能暴露給第三方開發人員。使用分段構建回調,開發人員可以將自己的行爲引入Webpack構建過程。插件的開發比起加載器(loaders)的開發更近了一步,因爲你需要用一些webpack底層的內部構件來鉤

原创 webpack的code spliting與chunks

爲什麼要使用代碼分割code spliting? 對於一個大型項目而言,將所有代碼打包進一個文件可能會導致打包後的文件非常大(雖然減少了請求次數,單個文件過大會導致阻塞),而且有些代碼只是在某些情況下是必需的,這就導致了效率低下。

原创 webpack工作流程分析

目前,幾乎所有業務的開發構建都會用到 webpack 。的確,作爲模塊加載和打包神器,只需配置幾個文件,加載各種 loader 就可以享受無痛流程化開發。但對於 webpack 這樣一個複雜度較高的插件集合,它的整體流程及思想對我

原创 webpack開發工具webpack-dev-server使用指南

使用初步 安裝webpack-dev-server: 在項目目錄下執行,npm install webpack-dev-server -g 運行 webpack-dev-server 自動刷新 有兩種模式自動刷新頁面

原创 webpack樣式處理

樣式嵌入 通過使用style-loader和css-loader,webpack可以將樣式文件打包進一個js包中(javascript bundle),你可以對你的樣式進行模塊化,就像require(‘./stylesheets.

原创 Html5 meta標籤用法總結

meta元素共有三個可選屬性(http-equiv、name和scheme)和一個必選屬性(content),content定義與 http-equiv 或 name 屬性相關的元信息。 可選屬性 屬性 值 描述 h

原创 HTML5文檔結構分析

html5規範將元素分爲三大類:元數據元素,流元素和短語元素 主體結構 DOCTYPE 元素 指示 web 瀏覽器關於頁面使用哪個 HTML 版本進行編寫的指令。html版本有:HTML 5,HTML 4.01 Strict,HT