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