每秒eval，400個方法調用；200多K的內存泄漏，
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>eval 測試</title>
<script>
var afunction = function(_name,_mask){
return false;
}
var bfunction = function(_color){
}
var cfunction = function(_color){
}
var _action = function(){
for(var i=0;i<40;i++){
var _script = "if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00');";
_script += "if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');";
var _func = new Function(_script);
_func();
}
}
window.onload = function() {
setInterval(_action,1000);
};
</script>
</head>
<body>
</body>
</html>
2.<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>eval 測試</title>
<script>
var afunction = function(_name,_mask){
return false;
}
var bfunction = function(_color){
}
var cfunction = function(_color){
}
var _action = function(){
for(var i=0;i<40;i++){
var _script = "if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00');";
_script += "if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');";
var _func = new Function(_script);
_func();
}
}
window.onload = function() {
setInterval(_action,1000);
};
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>eval 測試</title>
<script>
var _action = function(){
var afunction = function(_name,_mask){
return false;
}
var bfunction = function(_color){
}
var cfunction = function(_color){
}
for(var i=0;i<40;i++){
var _script = "if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00');";
_script += "if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');";
eval(_script);
}
}
window.onload = function() {
setInterval(_action,1000);
};
</script>
</head>
<body>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>eval 測試</title>
<script>
var _action = function(){
var afunction = function(_name,_mask){
return false;
}
var bfunction = function(_color){
}
var cfunction = function(_color){
}
for(var i=0;i<40;i++){
var _script = "if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00');";
_script += "if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');";
eval(_script);
}
}
window.onload = function() {
setInterval(_action,1000);
};
</script>
</head>
<body>
</body>
</html>
]]>
2.移動設備測試效果同1
3.桌面IE8下使用excanvas插件，可以打開看但效率很低，無法實現秒級刷新（IE9下效果未知）
使用canvas已可開發出非IE瀏覽器實時圖形，適合桌面和移動系統
桌面IE8及以下，仍然沒有高效的圖形展示方案
如客戶端局部刷新，應該能提高通訊、展示效率，但大大提升開發難度，但如想IE8下實現秒級刷新，估計只能依靠優秀的局部刷新技術來實現
2
2
]]>
2.arc 前必須beginPath
canvas_context.save();
canvas_context.scale(1, _scale);
canvas_context.beginPath();
canvas_context.arc(_centerX, _centerY, parseInt(_bounds[2] * 0.5), 0,(Math.PI/180)*360, true);
canvas_context.restore();
canvas_context.scale(1, _scale);
canvas_context.beginPath();
canvas_context.arc(_centerX, _centerY, parseInt(_bounds[2] * 0.5), 0,(Math.PI/180)*360, true);
canvas_context.restore();
]]>
Web的功能會越來越強大，這點基本上沒有多少人會反對。想想那么多在各種操作系統下跑的五花八門的應用程序，今天基本都能在Web上找到類似的應用，原因太簡單了，現在的客戶要求已經隨著PC和互聯網的發展慢慢提高了，他希望能在iphone里看股票，希望在imac上辦公，在blackberry里收郵件，誰能跨這么多復雜而多變的各類系統？
只有Web。
有Web就離不開瀏覽器，當然如果更加激進些，哪天整個操作系統都是web，那可能就沒有瀏覽器一說了。就時下來說，Web真的已經發展的很強大了。我們可以在瀏覽器里看新聞，逛論壇，采購物品，收發郵件，在線協同工作，操作office，游戲等等等等。如果說Web相當于桌面應用程序還有什么軟肋的話，那就是瀏覽器里的圖形展示。
說到這篇文章的重點，先大概梳理一下。目前瀏覽器端的圖形展示解決方案。Web里的圖形解決方案筆者自己給他大概分兩種，一種叫無插件，一種叫有插件。無插件嘛就是瀏覽器原生支持，就像打開html一樣。有插件嘛當然就是要裝插件的，插件就類似ActiveX等。
先說說有插件的，里面按使用人數又有大眾版和專業版，大眾版筆者羅列了幾個
1.
Flash，Flex
2.
Java
Swing,JavaFX
3.
Silverlight
4.
VRML
在這幾項技術Flash，Flex感覺是個比較有前途的方向，面向對象的語言，動靜結合的對象，基本各類瀏覽器都兼容的插件和現實效果，豐富的動態效果和絢麗的展示等，都是目前Web里圖形展示的Top one。唯一讓人感覺缺憾的是adobe這個設計師出生的公司，總讓程序員感覺不爽(要是IBM出的這技術該多好)。所以筆者是對Flex的源碼實現比較不齒，這哪里像個精品代碼應有的樣子。如果說還有什么缺陷，效率是一個，無法集成入搜索是一個，回退算是一個吧。
Swing要在Web展示，只能Applet了，這項被千萬java程序員唾罵的技術還是有頑強的生命力。為什么？實在是沒有辦法，除了它還能誰？(相對java程序員) 其實swing是個很不錯的技術，可惜了Sun好像不在意Applet的巨大潛力，只關系它的J2EE去了。唉！好在亡羊補牢，來了個新的JavaFX，只是java程序員已經對Applet心有余悸，JavaFx發展如何，再看看吧。
微軟的程序員有大奔頭了，因為他們有了SL，看看SL剛剛出來時候，那聲勢浩大的場面，真的是……如果我是微軟程序員，我肯定會搞搞SL，雖然它組件依舊很少，客戶端依舊安裝率不高。我就不怕，等的就是內置SL，絕對可以秒掉很多Flash的市場。
VRML最近才了解到的一個技術，看了下效果還是很震撼，可能程序員不是很熟原因也是它支持的公司基本都是設計軟件的公司。插件的安裝率估計是最低的，不了解的不說，一筆帶過。
上面說完了有插件，下面輪到無插件了，無插件的估計就那幾個：
1. VML
2. SVG
3. Canvas
VML(Vector Markup Language) 微軟的早期瀏覽器支持的圖形展示的一種格式。最大的特點就是只有IE支持，微軟估計當年根本沒想到IE的占有率會跌到60%，唉千萬不要低估消費者。你不行就靠邊，我用鼠標說話。
SVG(Scalable Vector Graphics) 我在無插件里最看好的技術，XML的子集，W3C下的一個項目，早幾年不瘟不火的，這幾年起來了，何以見得？HTML5的標準，IE9原生支持，看看各大廠家，誰希望被Adobe的Flash把持這么大一塊市場。當然由于微軟的原因IE9以前的版本還都需要插件才能支持SVG。
Canvas HTML5里另外一個重頭戲，介紹也是很多了，至于為什么會既有SVG又有Canvas我還真的不甚明白，誰知道W3C每天都在琢磨什么呢。最大的特點是2d的方式繪畫圖形，而不像SVG是標簽式的。
]]>
下
載:Internet
Explorer 9 預覽版
微軟稱，預覽版IE 9還不是一款完整的瀏覽器，目前還不包括地址欄等用戶導航工具以及安全功能。微軟發布了一個它稱之為“Test
Drive”的網站，方便網站設計人員、應用開發者了解預覽版IE 9的功能。
預覽版IE 9只支持Windows 7、Windows Vista SP2和Windows Server R2。IE
9可以利用圖形處理器的處理能力加速文本和圖形的渲染。
用戶可以從Test Drive網站下載大小為31MB的預覽版IE 9。
=============================================================
里面圖形的Demo 包括Graphics 里面的幾個例子，都是用SVG實現，包括了Map Chart等。有了IE支持，看樣子SVG又要發第二春了。
Canvas暫時還沒有看到使用例子。
]]>
]]>
??????????????? var p = origclass.prototype;
??????????????? for (var method in overrides) {
??????????????? //IE下無法遍歷到
?????????????? //"toString", "toLocaleString", "valueOf",
?????????????? //"hasOwnProperty", "isPrototypeOf", "propertyIsEnumerable"這幾個方法
??????????????????? p[method] = overrides[method];
??????????????? }
??????????????? if (TWaver.isIE) {? //IE 問題，目前只有'toString'用到，先處理
??????????????????? if (p['toString'] != overrides['toString']) {
??????????????????????? p['toString'] = overrides['toString'];
??????????????????? }
??????????????? }
??????????? }
??????? }
]]>
?特別的地方是：
??? instanceof不認為原始類型值的變量是對象，
???1.?var?temp="a?string?for?test";???
???2.?//下面這句返回"string"???
???3.?alert(?typeof?temp);???
???4.?//下面這句返回"false"???
???5.?alert(temp?instanceof?String);???
???6.???
???7.?//看看Ext內部實現，判斷String類型?
???8. if(? typeof temp== "string"){
?? 9. }
???2.?//下面這句返回"string"???
???3.?alert(?typeof?temp);???
???4.?//下面這句返回"false"???
???5.?alert(temp?instanceof?String);???
???6.???
???7.?//看看Ext內部實現，判斷String類型?
???8. if(? typeof temp== "string"){
?? 9. }
其他附加問題：
- null：表示尚未存在的對象，注意，盡管尚未存在，也是個對象啊，所以用typeof檢測一個null值變量的結果是Object；不過，為了便于寫if語句，在js中，"undefined==false", "null=false", 因此，"undefined==null"。
- 整數：最容易犯的錯誤就是，忘了070其實是個八進制數，相當于十進制的56；
- 浮點數：“在進行運算之前，真正存儲的是字符串”——這應該是解釋執行的本質決定的吧——直接后果是，alert(0.8)這樣的語句可以正確輸出，而alert(2*0.8)的輸出就成了"2.40000000000000003"
- 數字邊界： 數字有幾個邊界值，分別是Number.MAX_VALUE(最大值), Number.MIN_VALUE(最小值), Number.POSITIVE_INFINITY(正無窮), Number.NEGATIVE_INFINITY(負無窮), Infinity(無窮大，-Infinity，這個有點莫名其妙，不知道為啥又搞出一套)；特別地，還有一個isFinit(iNumber)函數來判 斷數字是否為無窮大。
- NaN：一些需要數字作為參數的函數，當傳入的實參無法轉換為數字時，往往會返回這個值；關于NaN，最重要的就是要記住NaN!=NaN，因此判斷一個變量是否為NaN，一定要使用isNaN(var)函數。
- 將字符串轉換為數字：sVar.parseInt() 是最常用的函數，也最容易出錯，為了保險起見，最好每次調用的時候，都加上“進制”的參數，比如：a.parseInt(10)，就制定了按十進制轉換字 符串a；Number(sVar)也是一種轉換方式，不同的是，它要求整個字符串都得是有效數字，因此Number("4.5.5")將返回NaN；
]]>
如果要用對象做為Key，這個Map可以來實現。
效率上由于_getIndex方法每次都要遍歷，耗時很長，所以通常在1:10左右
總結以上，如果Map的Key是String，最好還是用Object來實現。
而且用in來遍歷Map，效率上不是網上說的那么差，和for()差不多
TWaver.Map = function(){
??? this._entrys = null;
??? this.initialize.apply(this, arguments);
}
TWaver.Map.prototype = {
??? initialize: function(){
??????? this._entrys = new Array();
??? },
??? put: function(key, value){
??????? if (key == null || key == undefined) {
??????????? return;
??????? }
??????? var index = this._getIndex(key);
??????? if (index == -1) {
??????????? var entry = new Object();
??????????? entry.key = key;
??????????? entry.value = value;
??????????? this._entrys[this._entrys.length] = entry;
??????? }else{
??? ??? ??? this._entrys[index].value = value;
??? ??? }??? ???
??? },
??? get: function(key){
??????? var index = this._getIndex(key);
??????? return (index != -1) ? this._entrys[index].value : null;
??? },
??? remove: function(key){
??????? var index = this._getIndex(key);
??????? if (index != -1) {
??????????? this._entrys.splice(index, 1);
??????? }
??? },
??? clear: function(){
??? ??? this._entrys.length = 0;;
??? },
??? contains: function(key){
??????? var index = this._getIndex(key);
??????? return (index != -1) ? true : false;
??? },
??? getCount: function(){
??????? return this._entrys.length;
??? },
??? getEntrys: function(){
??????? return this._entrys;
??? },
??? _getIndex: function(key){
??????? if (key == null || key == undefined) {
??????????? return -1;
??????? }
??????? var _length = this._entrys.length;
??????? for (var i = 0; i < _length; i++) {
??????????? var entry = this._entrys[i];
??????????? if (entry == null || entry == undefined) {
??????????????? continue;
??????????? }
??????????? if (entry.key === key) {//equal
??????????????? return i;
??????????? }
??????? }
??????? return -1;
??? }
}
]]>
<script>
function rand(m,n){
????? //生成一個m、n之間的整數
??????? var i=Math.random();
??????? return Math.round((n-m)*i+m);
?}
?????????? ?
?????????? ?
function getRandomArr(m,n,l){
? //m：生成隨即整數的最小值，n：生成隨即整數的最大值，l：生成的數組的長度
??? var resultArr=[];
??? for(var i=0;i<l;i++){
??????? resultArr.push(rand(m,n))
??? }
??? return resultArr;
}
??? ?
function partition(a,st,en) ?
{ ?
??? var s=st; ?
??? var e=en+1; ?
??? var temp=a[s]; ?
??? while(1) ?
??? { ?
??????? while(a[++s]<temp); ?
??????? while(a[--e]>temp); ?
??????? if(s>e)break; ?
??????? var tem=a[s]; ?
??????? a[s]=a[e]; ?
??????? a[e]=tem; ?
??? } ?
??? a[st]=a[e]; ?
??? a[e]=temp; ?
??? return e; ?
} ?
function doSort(a,s,e) ?
{ ?
??? if(s<e) ?
??? { ?
??????? var pos=partition(a,s,e); ?
??????? doSort(a,s,pos-1); ?
??????? doSort(a,pos+1,e); ?
??? } ?
} ?
??? ?
Array.prototype.quickSort = function() ?
{ ?
????? doSort(this,0,this.length-1); ?
}
function sortIntF(a,b){return a-b}
function pk(num){
??? //num: 用于排序的數組的元素個數
??? //生成用于排序的數組
??? var arr=getRandomArr(1,999999,num);
??? ?
??? //當元素個數小于10000時，執行n次取平均值 ?
??? var n=Math.ceil(10000/num);
??? ?
??? //生成多個用于排序的數組的拷貝
??? var quickSortArrs=[];
??? var sortArrs=[];
??? for(var i=0;i<n;i++){
??????? quickSortArrs.push(arr.slice(0));
??????? sortArrs.push(arr.slice(0));
??? }
??? ?
??? var t1=new Date();
??? ?
??? for(var i=0;i<n;i++){
??????? quickSortArrs[i].quickSort();
??? }
??? ?
??? var t2=new Date();
??? ?
??? for(var i=0;i<n;i++){
??????? sortArrs[i].sort(sortIntF);
??? }
??? ?
??? var t3=new Date();
??? ?
??? alert("性能比較，對于"+num+"個元素的數組，平均每次排序花費時間如下：\n"
??? +"Array.prototype.sort："+((t3-t2)/n)+"ms\n"
??? +"quickSort："+((t2-t1)/n)+"ms\n"
??? );
??? ?
??? alert("排序結果是否正確："+(sortArrs[0].join()==quickSortArrs[0].join()));
}
pk(500);
pk(2000);
pk(30000);
</script>
]]>
]]>
]]>
]]>
]]>
]]>
]]>
]]>