Posted on 2011/03/25 18:27
Filed Under Development/HTML/Javascript

파이어폭스4도 나왔고 해서 이쯤에서 최신 브라우저들 자바스크립트 성능을 비교해 봤습니다.

자바스크립트 성능 테스트 사이트 : http://www.webkit.org/perf/sunspider/sunspider.html

여전히 크롬이 빨랐고 파폭도 많이 빨라졌고 IE는 매우! 빨라졌다 =_=

Firefox 4.0
============================================
RESULTS (means and 95% confidence intervals)
--------------------------------------------
Total:                 282.3ms +/- 1.8%
--------------------------------------------

  3d:                   37.0ms +/- 1.6%
    cube:               14.4ms +/- 3.5%
    morph:               7.0ms +/- 4.8%
    raytrace:           15.6ms +/- 3.9%

  access:               41.1ms +/- 4.1%
    binary-trees:        9.7ms +/- 3.6%
    fannkuch:           18.7ms +/- 4.0%
    nbody:               6.0ms +/- 5.6%
    nsieve:              6.7ms +/- 13.4%

  bitops:               17.7ms +/- 5.4%
    3bit-bits-in-byte:   0.8ms +/- 37.7%
    bits-in-byte:        9.6ms +/- 5.2%
    bitwise-and:         1.9ms +/- 11.9%
    nsieve-bits:         5.4ms +/- 6.8%

  controlflow:          12.1ms +/- 3.4%
    recursive:          12.1ms +/- 3.4%

  crypto:               23.2ms +/- 2.8%
    aes:                10.0ms +/- 4.8%
    md5:                 8.2ms +/- 3.7%
    sha1:                5.0ms +/- 0.0%

  date:                 44.4ms +/- 3.7%
    format-tofte:       26.3ms +/- 4.8%
    format-xparb:       18.1ms +/- 3.9%

  math:                 26.1ms +/- 4.9%
    cordic:              7.1ms +/- 7.4%
    partial-sums:        9.9ms +/- 6.3%
    spectral-norm:       9.1ms +/- 2.5%

  regexp:               12.7ms +/- 2.7%
    dna:                12.7ms +/- 2.7%

  string:               68.0ms +/- 2.1%
    base64:              4.2ms +/- 7.2%
    fasta:              12.3ms +/- 3.9%
    tagcloud:           20.9ms +/- 1.9%
    unpack-code:        22.4ms +/- 3.1%
    validate-input:      8.2ms +/- 5.5%



Chrome 12.0.712.0
============================================
RESULTS (means and 95% confidence intervals)
--------------------------------------------
Total:                 235.6ms +/- 2.1%
--------------------------------------------
  3d:                   32.5ms +/- 9.2%
    cube:               10.0ms +/- 22.1%
    morph:              11.2ms +/- 14.4%
    raytrace:           11.3ms +/- 11.9%

  access:               28.6ms +/- 11.9%
    binary-trees:        2.0ms +/- 0.0%
    fannkuch:           19.1ms +/- 16.8%
    nbody:               4.9ms +/- 10.8%
    nsieve:              2.6ms +/- 14.2%

  bitops:               24.7ms +/- 9.8%
    3bit-bits-in-byte:   2.0ms +/- 0.0%
    bits-in-byte:        6.0ms +/- 9.7%
    bitwise-and:         8.8ms +/- 3.4%
    nsieve-bits:         7.9ms +/- 29.1%

  controlflow:           3.0ms +/- 0.0%
    recursive:           3.0ms +/- 0.0%

  crypto:               21.2ms +/- 2.1%
    aes:                 7.7ms +/- 4.5%
    md5:                 6.9ms +/- 3.3%
    sha1:                6.6ms +/- 5.6%

  date:                 21.1ms +/- 3.0%
    format-tofte:        8.9ms +/- 2.5%
    format-xparb:       12.2ms +/- 3.7%

  math:                 24.0ms +/- 6.4%
    cordic:              5.0ms +/- 36.9%
    partial-sums:       12.8ms +/- 8.2%
    spectral-norm:       6.2ms +/- 4.9%

  regexp:                9.7ms +/- 3.6%
    dna:                 9.7ms +/- 3.6%

  string:               70.8ms +/- 1.7%
    base64:              4.3ms +/- 8.0%
    fasta:              12.4ms +/- 6.2%
    tagcloud:           17.3ms +/- 2.8%
    unpack-code:        25.1ms +/- 2.1%



Internet Explorer 9
============================================
RESULTS (means and 95% confidence intervals)
--------------------------------------------
Total:                  976.8ms +/- 0.6%
--------------------------------------------

  3d:                   141.9ms +/- 1.7%
    cube:                55.6ms +/- 3.1%
    morph:               28.0ms +/- 2.4%
    raytrace:            58.3ms +/- 0.8%

  access:               196.7ms +/- 1.2%
    binary-trees:        28.4ms +/- 1.3%
    fannkuch:            85.2ms +/- 1.2%
    nbody:               61.5ms +/- 2.1%
    nsieve:              21.6ms +/- 1.7%

  bitops:               160.7ms +/- 0.9%
    3bit-bits-in-byte:   39.7ms +/- 1.5%
    bits-in-byte:        39.2ms +/- 1.2%
    bitwise-and:         42.8ms +/- 0.7%
    nsieve-bits:         39.0ms +/- 1.5%

  controlflow:           38.2ms +/- 1.2%
    recursive:           38.2ms +/- 1.2%

  crypto:               100.7ms +/- 0.8%
    aes:                 32.9ms +/- 1.6%
    md5:                 32.4ms +/- 1.1%
    sha1:                35.4ms +/- 1.0%

  date:                  62.4ms +/- 2.1%
    format-tofte:        30.8ms +/- 2.1%
    format-xparb:        31.6ms +/- 2.7%

  math:                 103.3ms +/- 1.5%
    cordic:              13.4ms +/- 2.8%
    partial-sums:        51.2ms +/- 2.2%
    spectral-norm:       38.7ms +/- 2.0%

  regexp:                 6.4ms +/- 5.8%
    dna:                  6.4ms +/- 5.8%

  string:               166.5ms +/- 1.2%
    base64:              26.6ms +/- 1.9%
    fasta:               43.1ms +/- 1.8%
    tagcloud:            37.6ms +/- 1.8%
    unpack-code:         29.4ms +/- 1.7%
    validate-input:      29.8ms +/- 1.5%
2011/03/25 18:27 2011/03/25 18:27

Posted on 2011/03/18 17:24
Filed Under Development/HTML/Javascript

최근에 스프링 관련 공부를 하더보니 자바스크립트에도 이런걸 보게 되는군요!

이 플러그인은 jQuery 플러그인으로 자바스크립트에 AOP 구현을 가능하게 해줍니다.

예를 들어



function actionOne(s) {
	if(s == null) {
		alert('Wrong String!!');
		return false;
	}

	if(s.length == 0) {
		alert('Wrong String!!');
		return false;
	}		

	return s;
			
}


function actionTwo(s) {
	if(s == null) {
		alert('Wrong String!!');
		return false;
	}

	if(s.length == 0) {
		alert('Wrong String!!');
		return false;
	}		

	return s.toLowerCase();			
}


function actionThree(s) {
	if(s == null) {
		alert('Wrong String!!');
		return false;
	}

	if(s.length == 0) {
		alert('Wrong String!!');
		return false;
	}		

	return s.toUpperCase();
}



위와같은 코드가 있을경우 모든 함수에서 공통으로 받은 문자열을 체크하는 루틴이 있습니다.

기존의 방식대로라면 해당 부분을 따로 함수로 빼서 모든 부분에 각각 넣어줄수 있겠지만

jQuery 의 AOP 플러그인을 이용하면 다음과 같이 간결하게 바꿀수 있습니다.

jQuery.aop.before( {target: window, method: 'action*'}, 
	function(args) {
		console.log('apo before ' + args[0]);
					
		if(args[0] == null) {
			alert('Wrong String!!');
			return false;
		}

		if(args[0].length == 0) {
			alert('Wrong String!!');
			return false;
		}			
					
		
	}
);

function actionOne(s) {

	return s;
			
}

function actionTwo(s) {
	return s.toLowerCase();			
}

function actionThree(s) {
	return s.toUpperCase();
}


정의된 함수 action* (정규식이 적용됩니다.)  들이 실행되기전에(before) 가장 처음 정의된

함수를 실행해라 라고 명확하게 지정하여 사용할수 있습니다.

자바스크립트에서 AOP 흉내를 낼수 있다는 점이 흥미롭기는 하지만 역시나 AOP 로

되어있는걸 모르는 사람이 봤을때는 도데체 어디서 코드가 실행된건지 전혀 알수 있는

방법이 없습니다. 문서화가 명확하게 되어있어야 할듯...

관련링크


김제준 님의 글 http://starplatina.tistory.com/241
jQuery-aop http://code.google.com/p/jquery-aop/
2011/03/18 17:24 2011/03/18 17:24

Posted on 2010/01/18 15:58
Filed Under Development/HTML/Javascript

예전에도 포스팅했었는데 지금보니 제대로 동작하지도 않고 해서 새로 작성해서 올린다. 그리고 예제도 함께 넣었다.
2010/01/18 15:58 2010/01/18 15:58

Posted on 2008/12/31 09:28
Filed Under Development/HTML/Javascript

꽤 오래된 이슈이기는 하지만... 이렇게 깔끔하게 처리되는 1KB 짜리 스크립트가 있다.

http://labs.unitinteractive.com/unitpngfix.php

다운로드받아 열어보면
clear.gif 와 unipngfix.js 딸랑 두개다.
<script type="text/javascript" src="unitpngfix.js"></script>

unitpngfix.js 안에 보면 image 위치가 있는데 맞춰줘야 한다. 윈도우 onload 시에 실행되도록 하고 있지만 계속 변하는 이미지(동적으로)의 경우 회색으로 다시 되어버린다. 그럴때는 prefix() 를 다시 수행해주면 문제를 해결할수 있다.
2008/12/31 09:28 2008/12/31 09:28
TAG : , ,

Posted on 2008/08/07 11:54
Filed Under Development/HTML/Javascript

기본적으로 IE7이후보터는 클립보드에 복사할때 사용자에게 허용할것인지 묻는다. 이 메세지를 없에기 위해서는 플래시와 연동하여 사용하여야 한다.









2008/08/07 11:54 2008/08/07 11:54

Posted on 2008/06/16 15:49
Filed Under Development/HTML/Javascript

http://dean.edwards.name/packer/
2008/06/16 15:49 2008/06/16 15:49

Posted on 2008/06/04 14:58
Filed Under Development/HTML/Javascript

1. iframe 접근하기
contentWindow의 경우 양쪽다 지원하기 때문에 바로 쓸 수 있다.
//IE 코드
subFrame.document.boy.scrollHeight;
subFrame.location.href;

//Firefox 코드 
document.getElementById('subFrame').document.boy.scrollHeight;
document.getElementById('subFrame').location.href;

//Cross Browsing Code
document.getElementById('subFrame').contentWindow.document.boy.scrollHeight;
document.getElementById('subFrame').contentWindow.location.href;


2. 손모양 커서
cursor : pointer; 는 양쪽다 지원하기 때문에 바로 쓸 수 있다.
//IE 코드
<img src="foo.jpg" style="cursor : hand;">

//Firefox 코드, Cross Browsing Code
<img src="foo.jpg" style="cursor : pointer;">

2008/06/04 14:58 2008/06/04 14:58

Posted on 2008/05/08 11:41
Filed Under Development/HTML/Javascript

때때로 오른쪽 마우스 버튼 클릭을 막아야 할 경우가 있다. 이럴때 간단하게 쓸수 있는 스크립트이다.












<script language=JavaScript>
document.oncontextmenu=new Function("return false")
</script>
2008/05/08 11:41 2008/05/08 11:41

Posted on 2006/02/13 12:24
Filed Under Development/HTML/Javascript

/**
*    ie 6.0 설계변경에 따른 외부 스크립트 사용
*
*/
function putFlashObject(url, width, height) {
document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="' + width +'" height="' + height + '"><param name="movie" value="' + url + '"><param name="play" value="true"><param name="loop" value="true"><param name="menu" value="false"><param name="quality" value="high"><param NAME="wmode" VALUE="transparent"></object>');
}






<script language="JavaScript">
    putFlashObject("flash.swf", 100, 200);
</script>
2006/02/13 12:24 2006/02/13 12:24
TAG : ,

Posted on 2006/02/02 17:41
Filed Under Development/HTML/Javascript

MS 인터넷 익스플로러(IE)의 ActiveX 작동변경 내용



2006-01-23

Microsoft .NET MVP

삼성SDS 강상진



아래 내용은 2006년 1월 현재, 웹기반 어플리케이션을 개발하시거나,

기존의 웹 사이트를 유지보수 하시는 분들에게 해당하는 내용 입니다.

자세한 내용은 한국MS에서 제공한 첨부파일을 확인하시기 바랍니다.



첨부파일은 기술적인 내용과 함께 한국Microsoft에서 각 사에 보내는 공문 형식의

문서로 이루어져 있습니다.



간략하게 말씀드리면 2006년 2월부터 인터넷 익스플로러에 ActiveX활성화를 금지하는

패치가 추가 됩니다. 이 패치는 모든 웹사이트에 대하여 기존 ActiveX 개체를 비활성화 시킵니다.

이러한 쌩뚱맞은 정책의 배경은 다음과 같습니다.



- 발생배경 -

1. 인터넷 브라우져(IE, FireFox, Netscape, Opera 등) 에 또 다른 컴포넌트(대표적으로 ActiveX)를

삽입하는 기술에 대한 특허를 보유한 벤쳐기업인 이올라스(Eolas Technologies)社 에서

Microsoft를 상대로 IE가 ActiveX를 사용하는것에 대한 특허침해 부분을 미법원에 고소.

2. 미법원, Eolas사의 주장 인정하여, Microsoft 패소 (현재 항소 진행중)

3. Microsoft, 2006년 2월부터 ActiveX의 활성화를 차단하는 윈도우즈 패치 배포예정

4. Microsoft, 2006년 2월 15일, Windows Update에 '권장항목' 으로 등록 예정

5. Microsoft, 2006년 4월 12일, IE의 누적패치에 관련 패치 포함 예정

: 다른 보안 패치들과 함께 알게 모르게 자동배포된다고 보시면 됩니다.

6. MS에 대한 판결이 완료되면, 다른 브라우져에 대한 고소또한 진행될듯 합니다.

7. MS사가 특허료를 지불하고 계속 현재 내용을 유지하는것으로 합의가 될수도 있었으나,

이는 특허내용과 패소를 인정하는것이기에 하지 않는다고 합니다.



- 예상결과 -

1. HTML문서의 <Applet> , <Embed> , <Object> 태그로 삽입한 ActiveX 컨트롤과

즉시 상호작용 불가능 : 해당 개체의 UI를 클릭하여, 먼저 활성화해야 상호작용 가능

2. 비활성화 되는 ActiveX의 종류

Windows Media Player(동영상, 음악 삽입시) , Flash, VB나 C++로 자체 제작한 컴포넌트 등

3. 국내 사이트중, 금융뱅킹이나, 플래시로 제작한 서브메뉴 트리등이 타격이 심할것으로 예상



- 대비책 -

1. 원하지 않는 내용의 패치는 받지 않을수 있음. (근시안적 대책)

2. HTML로 삽입한 개체를 JavaScript로 작성하여 외부JS파일로 등록후 사용

: 첨부파일에 자세히 설명 되어 있음



- 추가내용 -

1. 확인결과, 플래시나, 윈도우즈 미디어 플레이어는 자동으로 Play는 됩니다.

(예 : 싸이월드,네이버 블로그의 배경음악등은 기존과 동일, PAUSE나 STOP을 위해서는

클릭이나 엔터를 사용하여 활성화 후에 가능)

2. 은행 사이트의 공인인증서는 기존과 동일하게 사용가능

3. 현재 패치의 Pre-DownLoad가 가능하니(MSDN Subscribers 사이트), 웹개발자들은

미리 각자의 웹사이트 소스수정을 하여 테스트 하는것이 가능 합니다.

4. 모든 IE 버젼에 동일하게 적용됩니다.

5. 2006년말 출시예정인 Windows VIsta에 포함된 IE7버젼에는 미리 적용되어 출시 됩니다.

6. UI를 가지고 있지 않는 ActiveX개체는 여기에 포함되지 않습니다.



한 가지 더 제 생각을 말씀 드리자면,

자동으로 페이지의 모든 ActiveX개체를 한번씩 클릭해주는 효과를

발생하는 스크립트나 기타 프로그램등.. 우회수(?)가 곧 생겨나지 않을까 생각 합니다..

하지만 이 방법이 특허내용을 마찬가지로 침해한다면 정식적인 배포는 불가능할것 입니다.



- 참고 사이트 -

1. IE, ActiveX 동작법 변경에 따른 파급 효과

http://channy.creation.net/blog/?p=213



2. IE, ActiveX 동작법 변경에 따른 파급 효과'를 읽고

http://blog.naver.com/saltynut/120020428904



3. Eolas와의 특허소송과 관련한 Microsoft의 입장

http://www.microsoft.com/korea/windows/ie/activex/default.mspx



4. ActiveX 컨트롤 활성화

http://www.microsoft.com/korea/windows/ie/activex/activate/default.mspx



5. 일반적 사항에 대한 FAQ

http://www.microsoft.com/korea/windows/ie/activex/faq/default.mspx



6. 기술적 사항에 대한 FAQ

http://www.microsoft.com/korea/windows/ie/activex/technical/faq/default.mspx



7. Activating ActiveX Controls

Link



8. 이올라스가 보유한 특허의 내용

Link



9. 이올라스가 보유한 특허에 대한 W3C 의장 팀 버너스 리의 입장

http://www.theregister.co.uk/2003/10/30/bernerslee_comes_out_fighting/

10. 이올라스가 보유한 특허에 대한 W3C의 입장

http://www.w3.org/2003/10/28-906-briefing.html.en

2006/02/02 17:41 2006/02/02 17:41
TAG : ,

Counter

· Total
: 361645
· Today
: 93
· Yesterday
: 110