前端開發工程師如何在2013年裏提高本身【轉】--2016已更新升級不少何去何從？

大部分人很是在乎我的在技術上的提高。可是保持對新技術的瞭解是一項不小的挑戰， 畢竟咱們須要的信息在數量上過於龐大。2012年裏，伴隨着前端發展的是大量的革命性突破和對前端的從新定義。

咱們在實踐的路上飛速前進，具體的進步體如今使用抽象化，優秀的代碼質量，維護性上的提高以及更好的性能。若是你實在忙到沒有時間來跟上最新的技術，不用擔憂。

隨着假日的來臨，咱們就有了一些空閒的時間能夠本身支配，我想，若是我把我收集的前端相關的精品討論列表分享出來，那必定會對你們有一些幫助。你不須要把全部的都閱讀一遍，可是這些相關的建議會讓你瞭解更多相關的知識，爲明年成爲一名更好的前工程端開發師作準備。

 

基礎部分

走在技術前沿的方法

How to Stay Up to Date on Web Stuff, Chris Coyier

即便技術相關的理念會不斷變化，咱們依然能夠作到讓本身處於技術的前沿。

 

確保你的開發模式已經跟上時代

A New Baseline for Front-End Developers, Rebecca Murphey

曾經在咱們編輯文件的時候，本地測試完而後傳到ftp上是最常規的作法。咱們經過一個前端是否能編寫一個兼容ie6的頁面來判斷他的前端水平。咱們在html，css和javascript中的技術都不夠強悍。

這樣的狀況在近幾年有了很大的轉變，隨着工做方式的改進和各種工具的推出。前端開發愈來愈受到重視，這個主題講解了前端在開發中的新起點。

 

 

前端開發工程師的新起點

理解瀏覽器在屏幕後面的工做原理

So, You Want to Be a Front-End Engineer, David Mosher (Video)

有些人會說，瀏覽器是他所知道的開發平臺中最不穩定的一個。若是你是一個客戶端開發工程師，理解瀏覽器內部工做原理會幫助你做出更好的決定，而且你 也會讚歎那些最佳實踐背後的種種辯論。在這個今年最好的主題之一里，david mosher會待你瞭解瀏覽器的解析和頁面的渲染。

 

瞭解web平臺如今須要提供什麼

Tooling for the Modern Web App Developer, Addy Osmani

web在不斷的進化，瞭解這個平臺中新出的技術不是一件容易的事情。html5的新特性讓咱們能夠構建一個徹底嶄新的web應用，包含不少之前沒法實現的特性（至少，在沒有插件的狀況下）。

在這個主題中，個人隊友eric會帶你瞭解html5的痛苦邊緣，關注不少解決現實世界問題的方案。你會了解媒體流，設備輸入，現代css設計，媒體捕捉，文件i/o等等。

 

工做方式

web app開發工程師的工做方式

不管你在使用coffeescript仍是javascript，less仍是sass，構建一個好的web應用在如今須要大量引用外部資源，框架，工具和結合工具來將他們整合到一塊兒。簡單地說，你須要一個打屁股用的實用腰帶。

在這個主題中，你會了解到當前前端系統的概況，並學習到一個新工具來整合這些系統，叫作yeoman。

你還能夠訪問這個主題的擴展版本。

 

web設計師的工做方式

A Modern Web Designer’s Workflow, Chris Coyier (Video)

今天咱們對web構架師的要求很高。若是在之前，這個崗位名稱已經表達了它所對應的工做，可是如今不只僅是視覺設計崗位，甚至涉及到交互的構建。設計師須要考慮不一樣形狀，不一樣尺寸，不一樣鏈接方式的不一樣設備，而且這些設備下都要能正常工做。

做爲一個設計師，你一般須要在團隊之間溝通和分享代碼，而且須要瞭解不少不一樣的技術。在這個主題中，chris coyier會說到不少使人讚歎的工具來幫助手頭的工做更加順利地完成，還會討論應該作些什麼來提供一個高水準的現代工做流。

 

移動web開發的工做方式

Mobile Web Developers Toolbelt, Pete Le Page (Video)

移動端開發和PC端開發有很大的不一樣，這個主題講述了各類工具來讓移動web開發更加方便，讓移動web開發更加容易。

 

如何調試

Secrets of the Chrome DevTools, Patrick Dubroy (Video)

深度瞭解谷歌開發者工具

 

面向將來的開發

CSS

The CSS of Tomorrow, Peter Gasston

這個主題介紹了CSS給你如今的開發帶來了什麼，做爲一個CSS程序員，如何利用CSS3來實現面向將來的開發。

 

JAVASCRIPT

The Future of JavaScript, Dave Herman

瞭解ES6的新特性，以及使用方式

 

WEB APPLICATIONS

Web Components and the Future of Web App Development, Eric Bidelman

如何更好地將各類新技術整合到你的web應用中。

 

CSS

CSS領域中的藝術

All the New CSS Hawtness, Darcy Clarke

這個主題介紹了最新的CSS實現以及相關的標準，而且學習到這些新的CSS技術是如何改變咱們的平常開發。

 

模塊化CSS

Your CSS Is a Mess, Jonathan Snook

大部分人的CSS代碼都是一團糟，在這個主題中，你會知道如何解決CSS的模塊化問題，方便管理和維護。

 

CSS的預處理器

CSS Pre-Processors, Bermon Painter

若是你尚未用過CSS預處理器，那你就OUT了。這個主題會對比較流行的幾個CSS預處理器進行概述。

 

文檔

A Better Future With KSS, Kyle Neath

本主題介紹了Kyle的一個工具，KSS，用於生成CSS文件的文檔和代碼格式化。

 

JavaScript

代碼風格的重要性

Maintainable JavaScript, Nicholas Zakas

編寫有趣的JavaScript代碼和編寫專業的JavaScript代碼是兩碼事，在Zakas的這個主題中，你會學習到如何作到編寫可持續性維護的JavaScript代碼

 

構建大規模的APP

SoundCloud’s Stack, Nick Fisher

這個主題中，來自SoundCloud的Nick Fisher會介紹他們公司開發一個大規模JavaScript APP的故事，而且分享他們的開發步驟以及如何提升開發效率。

 

從新思考應用的結構

Re-Imagining the Browser With AngularJS, Igor Minar

在這個主題中，你會了解如何將將來Web平臺的力量使用到當前的Web應用中。

 

國際化

Entschuldigen you, parlez vouz JavaScript, Sebastian Golasch (Video)

這個主題中，Sebastian介紹了從如何定位現實世界中的國際化問題，到如何用優雅的方式進行解決。

 

模式和原則

The Plight of Pinocchio, Brandon Keepers

咱們須要將JavaScript做爲一門真正的語言，就須要能在JavaScript上使用真正的語言會使用的各類最佳實踐。JavaScript再也不是一門玩具語言。

 

何時來延遲(惰性)加載腳本

How Late Is Later?, Massimiliano Marcon

咱們都知道延遲(惰性)加載腳本能夠提升Web應用的加載時間，那麼何時纔是正確的時間來加載腳本呢？

 

移動Web開發

Creating Responsive HTML5 Touch Interfaces, Stephen Woods (Video | Audio)

如何去解決UI和用戶間交互的問題，避免這些陷阱是不少應用開發者在將來須要面對的。

 

來自滾動條的挑戰

Embracing Touch: Cross-Platform Scrolling, Mark Dalgleish (Video)

滾動效果是最流行的移動頁面的方式。惋惜滑動的效果老是不能與原生滾動條媲美。咱們應該如何在移動瀏覽器上解決這個問題？

 

原生，HTML5和混合的應用

Native, HTML5 and Hybrid Mobile Development, Eran Zinman

這個主題中，Eran分享了他在跨平臺開發中的經驗。

 

性能，分佈和facebook在HTML5上的實踐

On the Future of Mobile Web Apps, Simon Cross

facebook利用HTML5作了什麼？還有什麼須要改進？

 

移動開發的調試工具

Mobile Debugging, Remy Sharp

 

響應式設計技術

Responsive Web Design: Clever Tips and Techniques, Vitaly Friedman

這個主題提供了響應式設計實現的概述。

 

Web Apps

離線的web應用

Offline Rules, Andrew Betts (Video)

如何在Web應用中作到客戶端的存儲，而且如何將其用在提升網站的體驗上。

 

STATE OF THE ART

Building Web Apps of the Future: Tomorrow, Today and Yesterday, Paul Kinlan (Audio)

Paul介紹瞭如何構建面向將來的web app。

 

客戶端存儲

Storage in the Browser, Andrew Betts

 

應用緩存

Application Cache: Douchebag, Jake Archibald (Video)

如何利用Application Cache來構建你的網站

 

性能

CSS

High-Performance CSS, Paul Irish

找出那些影響頁面性能的CSS，好比引起瀏覽器繪製至少多70毫秒的box-shadow，以及解決方案。

 

GitHub’s CSS Performance, Jon Rohan

 

避免JANK

Jank-Free: In Pursuit of Smooth Web Apps, Tom Wiltzius

JANK是指當動畫頓卡，特效執行緩慢，或者頁面滾動慢時的一種狀態。該主題介紹瞭如何避免這些狀態。

 

Web

Building Faster Websites, Ilya Grigorik

如何在網站的角度考慮總體性能的提高。

JavaScript

Breaking the JavaScript Speed Limit With V8, Daniel Clifford

如何打破V8執行腳本的速度限制。

 

測試

理解代碼的很差的緣由

Why Our Code Smells, Brandon Keepers (Video)

這個主題中，Brandon會介紹他平常的代碼，尋找那些會引發問題的劣質代碼，理解爲何會出現這些代碼，而且這些代碼意味着什麼，最後介紹如何對其進行重構。

 

CURRENT STATE OF THE ART

JavaScript Testing: The Holy Grail, Adam Hawkins (Video)

如何利用測試工具，來保證一個應用的體驗。

 

提升代碼的可測試性

Writing Testable JavaScript, Rebecca Murphey (Audio)

 

總結

花在思考本身技術提高上的時間是很是值得的。磨練的越多，你就更有機會去成爲一名優秀的工程師。

這個列表不必定會覆蓋今年全部優秀的PPT，不過仍是但願能給你們提供一些指引。去閱讀一些你感興趣的。這樣的閱讀會提升你的能力，也但願能真正爲你的平常開發提供幫助。

最後，祝你們享受節日，新的一年有更多的進步和突破。