前端開(kāi)發(fā)工程師如何在2013年里提升自己
大部分人非常在意個(gè)人在技術(shù)上的提升。但是保持對(duì)新技術(shù)的了解是一項(xiàng)不小的挑戰(zhàn)， 畢竟我們需要的信息在數(shù)量上過(guò)于龐大。2012年里，伴隨著前端發(fā)展的是大量的革命性突破和對(duì)前端的重新定義。
我們?cè)趯?shí)踐的路上飛速前進(jìn)，具體的進(jìn)步體現(xiàn)在使用抽象化，優(yōu)秀的代碼質(zhì)量，維護(hù)性上的提升以及更好的性能。如果你實(shí)在忙到?jīng)]有時(shí)間來(lái)跟上***的技術(shù)，不用擔(dān)心。
隨著假日的來(lái)臨，我們就有了一些空閑的時(shí)間可以自己支配，我想，如果我把我收集的前端相關(guān)的精品討論列表分享出來(lái)，那一定會(huì)對(duì)大家有一些幫助。你不需要把所有的都閱讀一遍，但是這些相關(guān)的建議會(huì)讓你了解更多相關(guān)的知識(shí)，為明年成為一名更好的前工程端開(kāi)發(fā)師做準(zhǔn)備。
基礎(chǔ)部分
走在技術(shù)前沿的方法
How to Stay Up to Date on Web Stuff, Chris Coyier
即使技術(shù)相關(guān)的理念會(huì)不斷變化，我們依然可以做到讓自己處于技術(shù)的前沿。
確保你的開(kāi)發(fā)模式已經(jīng)跟上時(shí)代
A New Baseline for Front-End Developers, Rebecca Murphey
曾經(jīng)在我們編輯文件的時(shí)候，本地測(cè)試完然后傳到ftp上是最常規(guī)的做法。我們通過(guò)一個(gè)前端是否能編寫(xiě)一個(gè)兼容ie6的頁(yè)面來(lái)判斷他的前端水平。我們?cè)趆tml，css和javascript中的技術(shù)都不夠強(qiáng)悍。
這樣的情況在近幾年有了很大的轉(zhuǎn)變，隨著工作方式的改進(jìn)和各類(lèi)工具的推出。前端開(kāi)發(fā)越來(lái)越受到重視，這個(gè)主題講解了前端在開(kāi)發(fā)中的新起點(diǎn)。
前端開(kāi)發(fā)工程師的新起點(diǎn)
理解瀏覽器在屏幕后面的工作原理
So, You Want to Be a Front-End Engineer, David Mosher (Video)
有些人會(huì)說(shuō)，瀏覽器是他所知道的開(kāi)發(fā)平臺(tái)中最不穩(wěn)定的一個(gè)。如果你是一個(gè)客戶端開(kāi)發(fā)工程師，理解瀏覽器內(nèi)部工作原理會(huì)幫助你作出更好的決定，并且你也會(huì)贊嘆那些***實(shí)踐背后的種種辯論。在這個(gè)今年***的主題之一里，david mosher會(huì)待你了解瀏覽器的解析和頁(yè)面的渲染。
了解web平臺(tái)現(xiàn)在需要提供什么
Tooling for the Modern Web App Developer, Addy Osmani
web在不斷的進(jìn)化，了解這個(gè)平臺(tái)中新出的技術(shù)不是一件容易的事情。html5的新特性讓我們可以構(gòu)建一個(gè)完全嶄新的web應(yīng)用，包含很多以前無(wú)法實(shí)現(xiàn)的特性（至少，在沒(méi)有插件的情況下）。
在這個(gè)主題中，我的隊(duì)友eric會(huì)帶你了解html5的痛苦邊緣，關(guān)注很多解決現(xiàn)實(shí)世界問(wèn)題的方案。你會(huì)了解媒體流，設(shè)備輸入，現(xiàn)代css設(shè)計(jì)，媒體捕捉，文件i/o等等。
工作方式
web app開(kāi)發(fā)工程師的工作方式
無(wú)論你在使用coffeescript還是javascript，less還是sass，構(gòu)建一個(gè)好的web應(yīng)用在現(xiàn)在需要大量引用外部資源，框架，工具和結(jié)合工具來(lái)將他們整合到一起。簡(jiǎn)單地說(shuō)，你需要一個(gè)打屁股用的實(shí)用腰帶。
在這個(gè)主題中，你會(huì)了解到當(dāng)前前端系統(tǒng)的概況，并學(xué)習(xí)到一個(gè)新工具來(lái)整合這些系統(tǒng)，叫做yeoman。
你還可以訪問(wèn)這個(gè)主題的擴(kuò)展版本。
web設(shè)計(jì)師的工作方式
A Modern Web Designer’s Workflow, Chris Coyier (Video)
今天我們對(duì)web構(gòu)架師的要求很高。如果在以前，這個(gè)崗位名稱已經(jīng)表達(dá)了它所對(duì)應(yīng)的工作，但是現(xiàn)在不僅僅是視覺(jué)設(shè)計(jì)崗位，甚至涉及到交互的構(gòu)建。設(shè)計(jì)師需要考慮不同形狀，不同尺寸，不同連接方式的不同設(shè)備，并且這些設(shè)備下都要能正常工作。
作為一個(gè)設(shè)計(jì)師，你通常需要在團(tuán)隊(duì)之間溝通和分享代碼，并且需要了解很多不同的技術(shù)。在這個(gè)主題中，chris coyier會(huì)說(shuō)到很多令人贊嘆的工具來(lái)幫助手頭的工作更加順利地完成，還會(huì)討論應(yīng)該做些什么來(lái)提供一個(gè)高水準(zhǔn)的現(xiàn)代工作流。
移動(dòng)web開(kāi)發(fā)的工作方式
Mobile Web Developers Toolbelt, Pete Le Page (Video)
移動(dòng)端開(kāi)發(fā)和PC端開(kāi)發(fā)有很大的不同，這個(gè)主題講述了各種工具來(lái)讓移動(dòng)web開(kāi)發(fā)更加方便，讓移動(dòng)web開(kāi)發(fā)更加容易。
如何調(diào)試
Secrets of the Chrome DevTools, Patrick Dubroy (Video)
深度了解谷歌開(kāi)發(fā)者工具
面向未來(lái)的開(kāi)發(fā)
CSS
The CSS of Tomorrow, Peter Gasston
這個(gè)主題介紹了CSS給你現(xiàn)在的開(kāi)發(fā)帶來(lái)了什么，作為一個(gè)CSS程序員，如何利用CSS3來(lái)實(shí)現(xiàn)面向未來(lái)的開(kāi)發(fā)。
JAVASCRIPT
The Future of JavaScript, Dave Herman
了解ES6的新特性，以及使用方式
WEB APPLICATIONS
Web Components and the Future of Web App Development, Eric Bidelman
如何更好地將各種新技術(shù)整合到你的web應(yīng)用中。
CSS
CSS領(lǐng)域中的藝術(shù)
All the New CSS Hawtness, Darcy Clarke
這個(gè)主題介紹了***的CSS實(shí)現(xiàn)以及相關(guān)的標(biāo)準(zhǔn)，并且學(xué)習(xí)到這些新的CSS技術(shù)是如何改變我們的日常開(kāi)發(fā)。
模塊化CSS
Your CSS Is a Mess, Jonathan Snook
大部分人的CSS代碼都是一團(tuán)糟，在這個(gè)主題中，你會(huì)知道如何解決CSS的模塊化問(wèn)題，方便管理和維護(hù)。
CSS的預(yù)處理器
CSS Pre-Processors, Bermon Painter
如果你還沒(méi)有用過(guò)CSS預(yù)處理器，那你就OUT了。這個(gè)主題會(huì)對(duì)比較流行的幾個(gè)CSS預(yù)處理器進(jìn)行概述。
文檔
A Better Future With KSS, Kyle Neath
本主題介紹了Kyle的一個(gè)工具，KSS，用于生成CSS文件的文檔和代碼格式化。
JavaScript
代碼風(fēng)格的重要性
Maintainable JavaScript, Nicholas Zakas
編寫(xiě)有趣的JavaScript代碼和編寫(xiě)專業(yè)的JavaScript代碼是兩碼事，在Zakas的這個(gè)主題中，你會(huì)學(xué)習(xí)到如何做到編寫(xiě)可持續(xù)性維護(hù)的JavaScript代碼
構(gòu)建大規(guī)模的APP
SoundCloud’s Stack, Nick Fisher
這個(gè)主題中，來(lái)自SoundCloud的Nick Fisher會(huì)介紹他們公司開(kāi)發(fā)一個(gè)大規(guī)模JavaScript APP的故事，并且分享他們的開(kāi)發(fā)步驟以及如何提高開(kāi)發(fā)效率。
重新思考應(yīng)用的結(jié)構(gòu)
Re-Imagining the Browser With AngularJS, Igor Minar
在這個(gè)主題中，你會(huì)了解如何將未來(lái)Web平臺(tái)的力量使用到當(dāng)前的Web應(yīng)用中。
國(guó)際化
Entschuldigen you, parlez vouz JavaScript, Sebastian Golasch (Video)
這個(gè)主題中，Sebastian介紹了從如何定位現(xiàn)實(shí)世界中的國(guó)際化問(wèn)題，到如何用優(yōu)雅的方式進(jìn)行解決。
#p#
模式和原則
The Plight of Pinocchio, Brandon Keepers
我們需要將JavaScript作為一門(mén)真正的語(yǔ)言，就需要能在JavaScript上使用真正的語(yǔ)言會(huì)使用的各種***實(shí)踐。JavaScript不再是一門(mén)玩具語(yǔ)言。
什么時(shí)候來(lái)延遲(惰性)加載腳本
How Late Is Later?, Massimiliano Marcon
我們都知道延遲(惰性)加載腳本可以提高Web應(yīng)用的加載時(shí)間，那么什么時(shí)候才是正確的時(shí)間來(lái)加載腳本呢？
移動(dòng)Web開(kāi)發(fā)
Creating Responsive HTML5 Touch Interfaces, Stephen Woods (Video | Audio)
如何去解決UI和用戶間交互的問(wèn)題，避免這些陷阱是很多應(yīng)用開(kāi)發(fā)者在未來(lái)需要面對(duì)的。
來(lái)自滾動(dòng)條的挑戰(zhàn)
Embracing Touch: Cross-Platform Scrolling, Mark Dalgleish (Video)
滾動(dòng)效果是***的移動(dòng)頁(yè)面的方式。可惜滑動(dòng)的效果總是不能與原生滾動(dòng)條媲美。我們應(yīng)該如何在移動(dòng)瀏覽器上解決這個(gè)問(wèn)題？
原生，HTML5和混合的應(yīng)用
Native, HTML5 and Hybrid Mobile Development, Eran Zinman
這個(gè)主題中，Eran分享了他在跨平臺(tái)開(kāi)發(fā)中的經(jīng)驗(yàn)。
性能，分布和facebook在HTML5上的實(shí)踐
On the Future of Mobile Web Apps, Simon Cross
facebook利用HTML5做了什么？還有什么需要改進(jìn)？
移動(dòng)開(kāi)發(fā)的調(diào)試工具
Mobile Debugging, Remy Sharp
響應(yīng)式設(shè)計(jì)技術(shù)
Responsive Web Design: Clever Tips and Techniques, Vitaly Friedman
這個(gè)主題提供了響應(yīng)式設(shè)計(jì)實(shí)現(xiàn)的概述。
Web Apps
離線的web應(yīng)用
Offline Rules, Andrew Betts (Video)
如何在Web應(yīng)用中做到客戶端的存儲(chǔ)，并且如何將其用在提高網(wǎng)站的體驗(yàn)上。
STATE OF THE ART
Building Web Apps of the Future: Tomorrow, Today and Yesterday, Paul Kinlan (Audio)
Paul介紹了如何構(gòu)建面向未來(lái)的web app。
客戶端存儲(chǔ)
Storage in the Browser, Andrew Betts
應(yīng)用緩存
Application Cache: Douchebag, Jake Archibald (Video)
如何利用Application Cache來(lái)構(gòu)建你的網(wǎng)站
性能
CSS
High-Performance CSS, Paul Irish
找出那些影響頁(yè)面性能的CSS，比如引發(fā)瀏覽器繪制至少多70毫秒的box-shadow，以及解決方案。
GitHub’s CSS Performance, Jon Rohan
避免JANK
Jank-Free: In Pursuit of Smooth Web Apps, Tom Wiltzius
JANK是指當(dāng)動(dòng)畫(huà)頓卡，特效執(zhí)行緩慢，或者頁(yè)面滾動(dòng)慢時(shí)的一種狀態(tài)。該主題介紹了如何避免這些狀態(tài)。
Web
Building Faster Websites, Ilya Grigorik
如何在網(wǎng)站的角度考慮整體性能的提升。
JavaScript
Breaking the JavaScript Speed Limit With V8, Daniel Clifford
如何打破V8執(zhí)行腳本的速度限制。
測(cè)試
理解代碼的不好的原因
Why Our Code Smells, Brandon Keepers (Video)
這個(gè)主題中，Brandon會(huì)介紹他日常的代碼，尋找那些會(huì)引起問(wèn)題的劣質(zhì)代碼，理解為什么會(huì)出現(xiàn)這些代碼，并且這些代碼意味著什么，***介紹如何對(duì)其進(jìn)行重構(gòu)。
CURRENT STATE OF THE ART
JavaScript Testing: The Holy Grail, Adam Hawkins (Video)
如何利用測(cè)試工具，來(lái)保證一個(gè)應(yīng)用的體驗(yàn)。
提高代碼的可測(cè)試性
Writing Testable JavaScript, Rebecca Murphey (Audio)
總結(jié)
花在思考自己技術(shù)提升上的時(shí)間是非常值得的。磨練的越多，你就更有機(jī)會(huì)去成為一名優(yōu)秀的工程師。
這個(gè)列表不一定會(huì)覆蓋今年所有優(yōu)秀的PPT，不過(guò)還是希望能給大家提供一些指引。去閱讀一些你感興趣的。這樣的閱讀會(huì)提高你的能力，也希望能真正為你的日常開(kāi)發(fā)提供幫助。
***，祝大家享受節(jié)日，新的一年有更多的進(jìn)步和突破。
