搜尋部落格文章

2012年9月19日 星期三

[轉] HTML5&Flash之粗知淺見

什麼是HTML
HTML(Hyper Text Mark-up Language)即超文本標記語言。 HTML文本是由HTML命令組成的描述性文本,HTML命令可以說明文字、圖形、動畫、聲音、表格、鏈接等。 HTML的結構包括頭部(Head)、主體(Body)兩大部分,其中頭部描述瀏覽器所需的信息,而主體則包含所要說明的具體內容。
什麼是HTML5:
我們所謂的HTML5所能達到的效果,並不是孤立的HTML升級版,而是HTML+CSS3+JS綜合起來的表現。HTML也只是一個標記語言,只是他進行了更加語義化的優化,增加了一些被認為更加科學的標籤,也去掉了一些標籤,但標記是標記,行為是行為,沒有CSS3、沒有JS,HTML也永遠只是個HTML而已。
HTML5目前任然是個草案,仍處於完善之中。 然而,大部分現代瀏覽器已經具備了某些HTML5 支持。 現在支持HTML5的瀏覽器有:Firefox 3.5、Chrome 3.0、Safari 3.0、Opera 10.5、IE9
HTML5與之前HTML對比:
簡單的說,HTML5比之前的HTML版本的標籤更加語義化,更加標準化,並且增加了一些新的標籤。
請看下圖:
這是以前網頁的HTML形式。 而新的的HTML是這樣的:
很顯然,HTML5已經不再像以前那樣一個DIV打天下了,新加了語義化的新標籤。 可能會讓前段工程師們在團隊協作上更加容易,因為有了統一的新標準。
形像一點來說吧,一個百貨倉庫,管理員老王來收拾倉庫,把各種衣帽鞋子和百貨分類放入不同的盒子中,在盒子上貼上標籤並寫上自認為合適的名字。 那些盒子我們可以理解為DIV,標籤上的起的名字class貨id。
那好了,問題來了。 老王下班了回家了,老李來接班,老李看了老王收拾的情況就開始罵街了,因為他看不懂老王在盒子上寫的標籤,害的他要挨個盒子打開看看究竟裡面放著什麼,這大大的降低了工作效率。
現在的HTML5就是直接把標記好了的盒子交給了老王,他可以根據不同的盒子來裝不同的衣帽鞋子,這樣等到老張來接班的時候就方便多了。 並且不止這樣,HTML5提供了更多的標籤來讓老張和老王們不用在麻煩其他同事而能獨立完成一些以前來講比較複雜的工作。
什麼是CSS:
CSS(Cascading Style Sheet,可譯為“層疊樣式表”或“級聯樣式表”)是一組格式設置規則,用於控制Web頁面的外觀。 通過使用CSS樣式設置頁面的格式,可將頁面的內容與表現形式分離。 頁面內容存放在HTML文檔中,而用於定義表現形式的CSS規則則存放在另一個文件中或HTML文檔的某一部分,通常為​​文件頭部分。將內容與表現形式分離,不僅可使維護站點的外觀更加容易,而且還可以使HTML文檔代碼更加簡練,縮短瀏覽器的加載時間。
什麼是CSS3:
CSS3是CSS技術的升級版本,CSS3語言開發是朝著模塊化發展的。 以前的規範作為一個模塊實在是太龐大而且比較複雜,所以,把它分解為一些小的模塊,更多新的模塊也被加入進來。 CSS3提供了非常多新途徑去改善你的設計工作,且做了不少重要的變化。
CSS3與之前CSS版本對比:
目前所知CSS3與之前版本相比,圓角、多背景、@font-face-用戶自定義字體、漸變色、盒陰影、RGBa – 加入透明色、文字陰影等等,讓代碼更簡潔、頁面結構更合理,性能和效果得到兼顧。
形像一點來說, 前面所說的HTML,既老李和老王們只是庫管工,而這裡所說的CSS,讓老張來做。 他的任務就是將貨物在商場上架,按照一定的順序,將貨物工整的排列到商場中。 否則您看到的頁面就想倉庫一樣,一大堆貨物一字長蛇陣的堆砌在那裡。 而CSS3讓老張不但是一個商場上架工,還能設計裝修店面,老闆,您有這樣的員工您真是賺到了。
什麼是javaScript:
JavaScript是一種基於對象和事件驅動並具有相對安全性的客戶端腳本語言。 同時也是一種廣泛用於客戶端Web開發的腳本語言,常用來給HTML網頁添加動態功能,比如響應用戶的各種操作。 它最初由網景公司的Brendan Eich設計,是一種動態、弱類型、基於原型的語言,內置支持類。 JavaScript也可以用於其他場合,如服務器端編程。 完整的JavaScript實現包含三個部分:ECMA,DOM ,BOM。 HTML 5引入了大量的新的Javascript API。 可以利用這些內容與對應的HTML元素相關聯。
什麼是API?
API(Application Programming Interface,應用程序編程接口)是一些預先定義的函數,目的是提供應用程序與開發人員基於某軟件或硬件的以訪問一組歷程的能力,而又無需訪問源碼,或理解內部工作機制的細節。
再形像一點理解,Javascript可以理解成一個能請神上身的神棍,咱們就叫他老劉。 那API呢? 就是js能請到各種大神兒。 請牛大神兒上身,那就變劉老牛,請虎大神兒,劉老虎,請豬大神兒,劉老豬,請猴大神兒,劉老猴等以此類推。
HTML5與FLASH:
很多人認為HTML5出現會秒殺Flash,以至於在各大web前端開發論壇吵得不可開交。 我不是HTML5的忠實信徒,也犯不著做Adobe的衛道士,讓咱們心平氣和的坐下來談談,他們兩個之間的那點事。
HTML5的優點:
1、 無需插件
2、 開放、免費
3、 對搜索引擎友好
HTML5的缺點:
1、 由於其目前仍處於草案階段,瀏覽器兼容性差
2、 開發模式單一,目前基本只靠記事本開發
FLASH的優點:
1、 普及率高,基本上每台PC機上都會裝有FlashPlayer
2、 多年的積累,眾多設計人員和開發者集中在Flash平台
3、 不存在瀏覽器兼容性問題
4、 Adob​​e提供的Flash和Flex提供有效的開發方案。
FLASH的缺點:
1、 耗電、性能不佳。
2、 封閉,收費
要說HTML5取代FLASH,那首先咱們要來討論一下功能方面的問題,即HTML5能否達到FlashPlayer10.1般絢麗的頁面效果。 個人認為這應該不是問題,HTML5目前只是個草案,他在正式發布前我們都可以有無限暢想,只要有足夠的動力需求,我相信這一點應該不會成為他發展道路上的大問題。
其次就是兩方面爭議都比較大的性能問題。 也就是人們常說的,FlashPlayer太耗費系統資源,在移動設備上也太耗電。 HTML5的性能一定比FLASH的性能高?我看倒也不見得。
如果用JS引擎寫一個Ajax版的XX農場,如果所有頁面廣告動畫都用JS來寫,我想那才叫性能低下。 為什麼那麼多網頁遊戲不是是Ajax做的呢? 為什麼很多優化的很好的Flash3D遊戲場景都很流暢,而一個2D的XX農場就能拖慢你的酷睿2呢? 目前Flash之所性能低下,最深的根源應該源於他的普及率廣,上手率高,進入門檻低,導致了Flash被一大部分水平參差不齊的Flash開發的人員的濫用。 所以也就產生了一大批性能低下的Flash產品面世。 所以未來HTML5要取代Flash 必須有一個高效的2D/3D圖形文字渲染引擎,和一個高效的JavaScript引擎。 這樣才能帶來更好的用戶體驗。
此外還有一個比較撓頭的問題,HTML5來了,他帶著他全新的標準雄赳赳、氣昂昂的來了。 但Adobe會一直停留在FlashPlayer10.1麼? 他會永遠不升級麼? 答案肯定是否定的。 但FlashPlayer是一個輕量級的插件,HTML5是一個重量級得標準,難道Flash每更新一次插件HTML5要跟著更新一次瀏覽器麼? 這貌似不太現實吧,即便的瀏覽器廠商辦得到,用戶們也會緊跟著瀏覽器廠商的腳步嗎? 這可就不太好說了,看看我們頑固的IE6老大爺,我對此持保留態度。
最後說點題外話,誰對HTML5的需求最迫切?
用戶想要HTML5嗎? 用戶才懶得管你什麼HTML和Flash呢,用戶關心的是應用,是體驗。 如果您能拿Ajax實現一個XX農場,我想沒有哪個用戶會引文這不是Flash做的而拒絕接受。
開發者想要HTML5嗎? 那需要一個成熟的HTML5+CSS3+JS的開發環境,需要各個瀏覽器提供統一的用戶體驗,即標準的完全兼容。 還需要增加新的學習成本。
那這轟轟烈烈的前端革命究竟誰是最大的受益者呢? 我想答案就是……Google和Apple!
我們可以意淫一下,如果HTML5真的得到了普及,那麼獲利最大的無疑是Google! 原因很簡單,當您面對一個功能和MicroSoft Word一摸一樣的Google Doc時,您會再去花錢買Word嗎? 在您的面前電腦上,所有的辦公應用和娛樂都只需要打開瀏覽器窗口,就全部能夠滿足時,您還會去花錢買操作系統嗎? 答案當然是:“NO!”。
再說Apple,Jobs想讓瀏覽器原生支持視頻音頻,這樣iPhone、iPad就不用嵌入Flash,Jobs當然不能讓Flash進iPhone OS,要不然App Store裡的遊戲誰去買? 同時,如果大量的應用都能基於瀏覽器實現時,用戶就不會被Windows的桌面應用套牢了。 漂亮時尚的Mac會比現在更暢銷。
綜上所述,Flash是一個不斷在發展的技術,有很強的靈活性,HTML5不可能完全取代Flash,眾多的開發人員也不會果斷拋棄Flash。
原因就是HTML5是瀏覽器廠商試圖改變軟件生態格局的戰略需要,並非人民群眾的迫切需求。 鑑於各大瀏覽器老大們以往的表現來看,兼容性上還有待觀察。 此外HTML5還需要一個成熟的開發環境,光一個記事本應該是搞不定。 在推廣方面最好實時的推出一些切實有力的應用來吸引用戶積極的更新瀏覽器,才能有效的完成HTML5的佈局。

[轉自] http://uedc.163.com/6675.html 

Flash與HTML5性能比較

近日,一項評測向人們證明了:

HTML5在性能上仍遠遠落後於Flashplayer。

測試使用了Droid X, Nexus One, Desire HD, Atrix, PlayBook, Galaxy Tab, Xoom 等設備,分別測試了點陣圖,向量圖 ,數值運算,視頻播放等項目。 
 
點陣圖 : 所有設備上Flash的 點陣圖 性能都優於HTML5,平均而言Flash的速度是HTML5的2倍。 

向量圖: 所有設備上Flash的  向量圖  圖性能都明顯優於HTML5,Flash的速度是HTML5的3到4倍。 
 
數值運算:  AS3的確是一種很慢的語言,但那隻是相對於Java和C#這些靜態語言而言的。 不論如今的js得到了多大的優化,都還無法超越支持靜態類型的AS3。 AS3腳本的速度比js快4倍左右。 
 
視頻播放: 這是唯一HTML5勝出的測試內容。 播放480p的視頻兩者都沒有問題,但對於720p的Flash視頻,僅有Playbook和Xoom可以流暢播放,HTML5在720p視頻的播放流暢度上全面超出flash。 但隨著Stage Video的普及,以及設備的固件和驅動升級,HTML5的這項優勢未必能長久保持。 
 
總結: 
Flashplayer比HTML5快得多,除非是為了支持iOS,否則盡量不要用HTML5開發web遊戲和多媒體應用。 瀏覽器開發商似乎也並不關心Canvas2D的性能,他們只關心CSS和SunSpider評分。 " 

2012年9月10日 星期一

Autodesk 3ds Max Design與3ds Max區別

問:3ds Max Design是什麼? 
答:3ds Max Design實質上是Autodesk® 3ds Max®的一個自定義版本,是針對建築師、設計師、工程師和可視化專家優化用戶體驗的結果。 3ds Max Design 具有與3ds Max 相同的功能,但增加了Exposure™ 燈光分析技術,不提供軟件開發工具箱(SDK)。兩個產品之間的其它區別包括用戶界面與應用程序默認設置、教程、示例文件和產品網站,其中每個組件都是針對其各自用戶量身定制的。 總體而言,Autodesk 3ds Max Design 是一個綜合性的3D 建模、動畫和渲染解決方案,被設計成能夠支持設計師和可視化專家的工作方式:創造性、迭代和橫跨多個軟件應用程序。與3ds Max Design 2009 相比,3ds Max Design 2010 引入了許多關鍵的新功能和改進功能,包括:100 多個新的建模工具,能讓設計師探索形狀製作,同時通過新的渲染質量的視口顯示精調設計;新的交互式燈光分析,可幫助更快地進行迭代、驗證可持續發展解決方案和在設計過程的早期避免昂貴的錯誤;並通過一個廣泛的粒子特效庫和無閃爍渲染改進簡化了精彩創想的交流。 3ds Max Design 2010 還提供更新的用戶界面和工作流程功能,這些功能與數據兼容性一起,可增強3ds Max Design 與Revit® 和AutoCAD® 系列產品之間的數字連續性。這些功能包括Recognize™ 場景加載技術,可通過準確地導入燈光、材質和像機,顯著改進與Revit Architecture 2010 的軟件間工作流程。

問:3ds Max 2010是什麼? 
答:Autodesk® 3ds Max® 2010是一個全功能的3D建模、動畫、渲染和視覺特效解決方案,廣泛應用於最暢銷的遊戲以及電影大片和電視內容的製作。3ds Max 2010引入了幾個關鍵的新功能,包括:新的Graphite建模工具,將100多個新的建模工具統一在一個創新的用戶界面中;新的強大的參照工作流程,可輕鬆組織複雜的場景;新的Material Explorer,用於導航或修改場景中所有與渲染有關的資產;新的xView網格分析技術,可在視口中報告多種類型的網格錯誤;以及ProOptimizer、PFlowAdvanced和ProSound (以前只作為Creativity Extension的一部分提供)。最後,3ds Max 2010通過Autodesk® FBX®和OBJ文件轉換提供與Autodesk® Mudbox™、Autodesk® Maya®和Autodesk® MotionBuilder™的兼容性。所有這些功能也在3ds Max Design 2010中提供。

問:為什麼3ds Max有兩個版本? 
答:為了優化娛樂和設計可視化客戶的用戶體驗,我們提供兩個版本的3ds Max:3ds Max Design和3ds Max。 娛樂用戶一般專門從事角色搭建、燈光、紋理和動畫等領域的工作。對於這些客戶,3ds Max 2010 繼續秉承了其作為遊戲、電影和電視行業領先的內容製作工具的傳統。而3ds Max Design 的方向是為建築、土木工程、工業和製造業的設計可視化專家最大化“開箱即有”的高質量體驗。 3ds Max 的每個版本都是專門針對其意向用戶量身定制的— 從學習資源和示例文件,到應用程序默認設置,甚至精心選擇的功能,例如面向設計師和可視化專家的Exposure 燈光分析技術。

問:3ds Max與3ds Max Design哪一個適合我? 
答:如果你主要從事娛樂業工作並且需要SDK,則可選擇3ds Max 2010。除了 ​​幫助獲得LEED EQ Credit 8.1認證的Exposure燈光分析工具之外,3ds Max具有3ds Max Design的所有功能。 如果你主要從事建築、土木工程或製造業工作,而且不需要使用SDK 開發自己的插件,則可以選擇3ds Max Design 2010。除了SDK 之外,它具有3ds Max 2010 的所有功能,並且包括幫助取得LEED EQ Credit 8.1 認證的新的Exposure 燈光分析工具。

問:除了SDK和Exposure燈光分析之外,3ds Max與3ds Max Design之間還有什麼區別? 
答:3ds Max與3ds Max Design的關鍵區別在於每個產品都是專門針對不同行業的客戶量身定制的。3ds Max Design非常適合建築師、工程師、設計師和可視化專家,而3ds Max是遊戲、電影和電視業專業人員的首選工具。 雖然這兩個同胞軟件在技術上幾乎完全相同,但在以下方面卻各具特色: *為了最大程度地提高生產力,用戶界面和應用程序默認設置分別針對可視化或娛樂工作流程/製作流程進行了優化 * 3ds Max Design包含用於模擬和分析太陽、天空及人工照明的Exposure技術 * 3ds Max不含該技術 * 3ds Max包含一個適用於開發人員的強大SDK * 3ds Max不含這個SDK *教程和示例文件將進行自定義,以優化每個產品的每個客戶群的學習體驗 *文檔也包含每個產品的自定義內容 * 3ds Max Design的圖標與包裝將更加密切地與Autodesk AEC解決方案保持一致,可從視覺上快速識別。3ds Max 2010圖標仍將與3ds Max 2009圖標相似。 *通過針對可視化或娛樂客戶量身定制的內容,在線用戶體驗將大大改進

問:3ds Max與3ds Max Design的哪些功能是相同的? 
答:除了SDK,3ds Max Design具有3ds Max的所有功能。3ds Max與3ds Max Design共享一個二進制代碼庫。這意味著從技術的角度看,兩個軟件將能夠同時進步。當3ds Max針對Microsoft® Windows®操作系統(OS)或DirectX®應用程序編程接口(API)進行更新時,3ds Max Design也將更新。一個二進制代碼庫意味著兩個軟件之間具有完全的文件兼容性和插件兼容性。

問:我目前有一個較早版本的3ds Max,請問如何獲得3ds Max Design 2010? 
答:如果你目前有3ds Max 2009或3ds Max Design 2009的Autodesk®維護合約,則會在3ds Max 2010或3ds Max Design 2010產品可以下載時收到電子郵件通知。如果沒有維護合約,只需選擇一個產品,然後升級到新版本即可。請下載免費的30天試用版,了解哪一個產品適合你。

問:3ds Max與3ds Max Design將來會有什麼區別?
答:Autodesk將認真考慮客戶反饋、行業驅動因素和業務需求,以評估將來如何改進3ds Max Design和3ds Max。Autodesk打算在兩個產品之間保持相同的二進制代碼以及全面的數據兼容性和協同工作能力。

問:我挑選了錯誤的3ds Max版本,現在該怎麼辦? 
答:如果你正在使用3ds Max Design,並且認為自己需要SDK來編寫自己的插件,則只需註冊Autodesk Developer Network (ADN),繼續使用3ds Max Design就可以了。如果你擁有Autodesk維護合約,則可以通過3ds Max自我選擇計劃從3ds Max Design 2009跨平台升級到3ds Max 2009,反之亦然。所有維護合約客戶都將收到該計劃的電子郵件通知。

問:能否並行運行3ds Max Design和3ds Max? 
答:是的,現在可以在同一台計算機上運行3ds Max和3ds Max Design。由於這兩個軟件在特性和功能性方面幾乎完全相同,因此大多數客戶不需要並行安裝。

FlashDevelop Plugin - NavigationBar

NavigationBar 可以快速切換至類別中已宣告的全域屬性以及方法

 如下圖



我們常常會在程式碼中徘徊

若不幸方法寫得很長篇,又想找出自己所在方法的話

往往總是得滾動捲軸, 拉很長一段才知道自己目前所在哪個方法中

NavigationBar可以直接幫你定位,讓你一目瞭然

2012年9月5日 星期三

Url編碼轉換

//轉換成BIG5 
public static function urlencodeBIG5(str:String):String {
var result:String = "";
var byte:ByteArray = new ByteArray();
byte.writeMultiByte(str, "big5");

for (var i:int; i < byte.length; i++) {
result += escape(String.fromCharCode(byte[i]));
}
return result;
}


//轉換成UTF-8
public static function urlencodeUTF8(str:String):String {
var result:String = "";
var byte:ByteArray = new ByteArray();
byte.writeMultiByte(str, "utf-8");

for (var i:int; i < byte.length; i++) {
result += escape(String.fromCharCode(byte[i]));
}
return result;
}

請參閱「支援的字元集」 




2012年8月13日 星期一

Array的多條件排序

陣列中元素為基本類型資料(String,int,uint)
可使用Array.sort(); 對陣列中的元素進行排序

若陣列中元素為Object類型,內含多種屬性與值
例如: id,type,width,height,amount ...等

若想依某個條件排序,可使用Array.sortOn("屬性名稱");
例: array.sortOn("amount");

因為是數量,所以必須按照數值排序而非預設的字串排序,故添加第二個參數Array.sortOn("屬性名稱",排序方式);
例: array.sortOn("amount",Array.NUMERIC); 

單一條件排序很好用,但實際專案上可能會需要用到多條件排序,如下
  1. type
  2. amount
  3. id 

Array.sortOn( fieldName,options);
注意: fieldName 和 options 陣列必須具有相同的元素數目,否則會忽略 options 陣列。 此外,Array.UNIQUESORT 和 Array.RETURNINDEXEDARRAY 選項只能用來當做陣列的第一個元素,否則便會忽略這些選項。

可以這麼寫
array.sortOn(["type","amount","id"],[Arrar.CASEINSENSITIVE,Array. NUMERIC,Array. NUMERIC]);
也可對二維陣列排序
var arr:Array=[[1,2,3],[3,2,1],[2,1,3],[10,20,3],[3,10,1]]
arr.sortOn([0,1], Array.DESCENDING|Array.NUMERIC);