使用最好技術的不可見成本:AngularJS

edithfang發表於2014-09-16



很多企業家都對使用最好的技術代表著什麼存在盲區:他們認為這更像是新技術將提供的功能,需要多長時間完成編碼,以及是否值得。

他們常常忽略了基於公司能力去選擇前沿技術的後果,而是僱傭、做 SEO、相容很多瀏覽器和整合通用外掛。

我們僱傭的前端工程師建議了 AngularJS,在做了研究之後,發現 Google 支援它,我們決定嘗試。Ember.js 貌似太新而沒有太多的最新文件,我們聽說,即便 Backbone.js 已經非常普遍了,AngularJS 與 Backbone.js 相比,是更加優雅的解決方案。

這個決定讓我們感到高興,但是我們對於隨之而來的、沒有預料到的、很多不同問題感到吃驚,在我們首次決定使用 AngularJS 時,並沒有小心權衡。下面是你採用 AngularJS 之前應該考慮的一些地方,而實際上適用於任何新的前沿技術。

1)低版本瀏覽器

AngularJS 不支援低於 8 的 IE 版本。目前,我們的網站不支援 IE8 和 IE9,我們仍然在儘量解決中。搞清楚 IE10 當中的 bug 花了不少時間。所有 IE 使用者佔到了 25% 流量,IE8 和 IE9 大約佔到了這部分流量的 80%。還不能使用我們網站的使用者是相當多的,嚴重影響了我們的轉化率。

面向 IE8 和 IE9 這些低版本瀏覽器程式設計已經足夠困難了,在那些瀏覽器很少能處理好 CSS 怪異現象的前提下,增加一個新的前沿前端技術也就成了相當巨大的障礙。

2)SEO

如果你有完全用 AngularJS 實現的 app,那意味著相當有可能你的原始碼只是 JavaScript 檔案。Google 還沒有找到抓取動態內容的有效方法,如果你不做出一些調整,你可就要倒黴了。

我們有了存在於 AngularJS SPA(單頁應用程式)之外的“混合”頁面,它們是 Django(我們在用 Python 框架)裡的普通頁面,內容是可被爬蟲抓取的。這些頁面只在一個地方呼叫了 AngularJS,那就是搜尋框,當你搜尋的時候,AngularJS 會被呼叫。

這意味著我們有必要讓一堆附屬內容散落在中央 AngularJS 的 app 周圍。

這也意味著在頁頭和頁尾的某些程式碼需要被複制,因此當我們想增加一個類庫或標籤時,我們需要在兩個地方增加。

3)Adsense、Clicktale 以及很多類庫都不能直接使用了

Adsense 不能在載入動態內容的網站執行。事實上,做個變通方案,是可以讓它成為可能(iFrame 等等)的,但是違反了服務條款(TOS:terms of service)。這意味著,AngularJS 以及使用了 Ajax 的任何東東,都不能直接使用 Adsense 了。

我稍微休息一會兒:是的,世界上最重要的線上廣告領導者還沒有找到一種在動態載入內容的網頁上呈現廣告的簡單方法。而 AngularJS 是新興的、通過 Ajax 載入動態內容的,肯定不可以了,Google 也沒有找到有效的解決方案也是讓我頗受震動的。

Adnsense 不能正常執行是因為它要等到 DOM 被構造好以後,才能基於網頁內容例項化廣告。它是在網頁載入完成之後才執行的,但是對於 AngularJS 之類的“單頁應用程式”,你從來不需要重新載入一個頁面,所有內容都是動態載入的,在“頁面”直接實現了無縫切換。

花了一整天找到的解決方案就是使用 Doubleclick For Publishers【注2】,一個不同的 Google 產品,通過它來載入 Adsense。一旦新的“頁面”被載入,我們不得不“重新整理”廣告區域。這是個小伎倆,卻是有效的。

真的花了好長時間才搞定的。

與 Clicktale 類似,我們使用軟體監視使用者會話並找到可用性問題。對於普通網頁,你只需一段程式碼,但是對於我們的網站,我們不得不使用它們的特定 API。

本來 5 分鐘的事情,以色列的技術團隊來來回回搞了一週。

4)程式設計師

很多程式設計師對新技術不瞭解,因此當僱人的時候,你不會有太多選擇。

在我們發起了重要的合作伙伴關係的那一天,前端程式設計師離職了,我們才碰到了這個問題。我們招到了某個員工的一個白俄羅斯朋友,他實際上有對 AngularJS 貢獻過原始碼。他們從他的日程上抽出時間作為對我們的個人支援。但是我們說到的大部分人沒有 AngularJS 經驗,通常的反應會是“是的,我們正打算學習呢,因為它絕對是未來,但是我們還沒有這方面的專家。”

總結

總之,在你面臨使用 AngularJS 之類的新技術的選擇時,你需要考慮的因素有很多,決不僅僅是“它是一個不錯的框架”。你需要考慮招到人有多大難度,這個人要了解該框架,像 SEO 之類業務的其它方面的後果、廣告整合以及跨瀏覽器相容。

我們對 AngularJS 非常滿意,因為我們有資金和時間來開發長期內可持續的功能,不過,它一定不適合每一個人。

當前沿技術引發的所有潛在複雜問題出現時,做為一家公司,要確信你有能力搞定。
  • 原文地址:http://davidlitwak.com/the-unseen-cost-of-using-the-best-technology-angularjs
  • 注1:Clicktale 成立於 2006 年,相對於偏統計的流量分析工具,Clicktale 偏向定性,它可以告訴使用者為什麼網站轉化率上升了,使用者體驗上升了?而不是簡單的流量多少,流量產生時間和流量渠道。主要是因為 Clicktale 能夠錄製網站訪客行為,將訪客的一舉一動全都錄製下來,並且通過播放器完整地展示。除了視訊錄製,還包括熱力圖、轉化漏斗、表單分析等強大功能。Clicktale 追蹤資料的技術屬於 Javascript 標記,類似市場上通用的跟蹤,例如 Adobe Sitecatalyst, google analytics, 百度統計,CNZZ 等,程式碼安裝非常簡單和方便。http://www.clicktale.com


  • 注2:DoubleClick for Publishers (DFP)是 Google 的第三方廣告託管解決方案,前身為 Google Ad Manager,整合 DoubleClick 的 DFP 產品之後推出正式的 DFP 系統。https://www.google.com/dfp/
英文原文:The Unseen Cost of Using the Best Technology: Angular.js
相關閱讀
評論(2)

相關文章