天天看點

前端開發工程師如何在新的一年裡提升自己

大部分人非常在意個人在技術上的提升。但是保持對新技術的了解是一項不小的挑戰, 畢竟我們需要的資訊在數量上過于龐大。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領域中的藝術

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檔案的文檔和代碼格式化。

前端開發工程師如何在新的一年裡提升自己

代碼風格的重要性

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來建構你的網站

前端開發工程師如何在新的一年裡提升自己

性能

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

如何在網站的角度考慮整體性能的提升。

前端開發工程師如何在新的一年裡提升自己

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,不過還是希望能給大家提供一些指引。去閱讀一些你感興趣的。這樣的閱讀會提高你的能力,也希望能真正為你的日常開發提供幫助。

最後,祝大家享受節日,新的一年有更多的進步和突破。

來源:51cto

繼續閱讀