본 글은 구글이 운영하고 있는 HTML5ROCKS (HTML5 개발자 사이트)에 올라온 Best Practices for a Faster Web App with HTML5를 기반으로 번역하여 정리한 것이다원문과 거의 비슷하지만 완전히 똑같이 번역한 것은 아니다.

원문http://www.html5rocks.com/tutorials/speed/quick/

  

n  소개 

HTML5의 많은 부분은 지금까지 자바스크립트 라이브러리로 처리했던 다양한 기술과 기능에 대한 네이티브 브라우저 기능을 제공하는 것이다이러한 기능을 사용하는 것은 처리속도를 훨씬 빠르게 만들 수 있다본 튜터리얼에서는 어떻게 HTML5 CSS3를 이용하여 반응이 빠른 애플리케이션을 개발할 수 있는지에 중점을 둔다.

 

n  1: 쿠키 대신 웹 저장소를 사용하라

쿠키는 지금까지 사용자 데이터를 식별하기 위해 지금까지 사용되어 왔지만 이는 심각한 단점들을 가지고 있었다가장 큰 결점은 모든 쿠키 데이터가 모든 HTTP 헤더에 추가된다는 것이다이는 성능에 커다란 악영향을 줄 수 있으며특히 XHR을 사용하는 경우에는 더욱 문제가 될 수 있다그래서 모범사례는 쿠키 크기를 줄이는 것이다. HTML5에서는 이보다 더 효과적인 방법이 있는데이는 쿠키 대신 sessionStorage localStorage를 사용하는 것이다.

 

// if localStorage is present, use that

if (('localStorage' in window) && window.localStorage !== null) {

 

  // easy object property API

  localStorage.wishlist = '["Unicorn","Narwhal","Deathbear"]';

 

} else {

 

  // without sessionStorage we'll have to use a far-future cookie

  //   with document.cookie's awkward API :(

  var date = new Date();

  date.setTime(date.getTime()+(365*24*60*60*1000));

  var expires = date.toGMTString();

  var cookiestr = 'wishlist=["Unicorn","Narwhal","Deathbear"];'+

                  ' expires='+expires+'; path=/';

  document.cookie = cookiestr;

}

 

 

n  2: 자바스크립트 애니메이션 대신 CSS Transitions를 사용하라 

CSS Transitions는 두 상태간의 아주 매력적인 시각 효과를 준다대부분의 스타일 프로퍼티는 택스트 그림자(text-shadow), 위치(position), 배경 또는 색상 등에 대한 처리로 변화될 수 있다. “:hover” 또는 HTML5 , “:invalid”과 “:valid”와 같이 pseudo-selector states 변화하여효과를   있다.

 

div.box {

  left: 40px; 

  -webkit-transition: all 0.3s ease-out;

     -moz-transition: all 0.3s ease-out; 

       -o-transition: all 0.3s ease-out; 

          transition: all 0.3s ease-out;

}

div.box.totheleft { left: 0px; }

div.box.totheright { left: 80px; }

 

“totheleft”와 “totheright” 클래스 토글링(toggling)을 추가하여 box를 이동할 수 있다이 코드의양을 자바스크립트 애니메이션 라이브러리와 비교해 보자명확히 브라우저에 보내지는 바이트 수는 CSS 기반 애니메이션을 사용할 때가 훨씬 적다추가적으로 GPU 레벨 가속화를 이용하면 이러한 시각 효과는 아주 부드럽게 처리될 것이다.

 

 

n  3: 서버와 통신하는 대신 클라이언트측의 데이터베이스를 사용하라 

Web SQL Database IndexedDB는 클라이언트 측의 데이터베이스 기능이다. XHR 또는 폼 제출(form submission)를 이용해 데이터를 서버에 포스팅하는 것이 일반적인 패턴이지만이러한 방식 대신 클라이언트 측의 데이터베이스를 사용할 수 있다. HTTP 요청을 줄이는 것이 모든 성능 엔지니어의 1순위 목표이다따라서 데이터베이스를 이용하여 서버와의 통신을 많이 줄일 수 있다. localStorage 그리고 sessionStorage는 특정 사이트의 각 단계별 입력 정보를 저장하는데 활용할 수 있으며이는 클라이언트 측의 데이터베이스 API 보다 훨씬 빠르다.

예를 들면만일 수백개의 메시지를 갖은 데이터 그리드 컴포넌트 또는 수신함이 있을 때로컬 데이터베이스 안에 데이터 저장을 한 것은 사용자가 검색필터링정렬 등을 원할 때HTTP로 서버와 통신하는 것을 크게 줄일 수 있다.

좀더 자세히 이해하고 싶으면 Web SQL Database Tutorial을 참고해라

 

n  4: 자바스크립트 개선은 상당한 성능 개선을 제공한다 

자바스크립티 1.6에는 Array prototype에 대한 많은 메소드가 추가되었으며, 이들은 지금 IE를 제외한 대부분의 브라우저에서 사용가능하다.


// give me a new array of all values multiplied by 10

[5,6,7,8,900].map(function(value){ return value*10; }); // [50,60,70,80,9000]

  

// create links to specs and drop them into #links

['html5','css3','webgl'].forEach(function(value){

  var linksList = document.querySelector('#links');

  var newLink = value.link('http://google.com/search?btnI=1&q=' + value + ' spec');

  linksList.innerHTML +=  newLink;

}); 

 

// Return a new array of all mathematical constants under 2

[3.14, 2.718, 1.618].filter(function(number){

  return number < 2;

});

// [1.618]

 

// You can also use these extras on other collections like nodeLists

[].forEach.call(document.querySelectorAll('section[data-bucket]'), function(elem,i){

  localStorage['bucket' + i] = elem.getAttribute('data-bucket');

})


대부분의 경우 이들 Native 메소드를 사용하는 것은 전형적인 for 루프를 사용하는 것 보다 훨씬빠르다: for ( var i = 0; len = arr.length; i < len; i++ ).

Native JSON 파싱( JSON.parse() ) json2.js 파일을 대체한다. Native JSON은 외부의 스크립트를 사용하는 것보다 훨씬 빠르고 안전하다이미 IE8, 오페라 10.50, 파이어폭스 3.5, 사파리4.0.3 그리고 크롬에서 이미 제공한다.

 

n  5: 라이브 사이트에 대해서도 캐쉬 매니페스트(cache manifest)를 사용하라 

2년전에 워드프레스(Wordpress는 워드프레스 터보(Wordpress Turbo)라는 기능을 추가하기 위해 구글 기어스(Google Gears)를 사용했다이는 속도를 높이기 위해 관리 패털의 많은 자원들을 로컬에 캐슁하였다우리는 이와 같은 기능을 HTML5의 애플리케이션 캐쉬(applicationCache) cache.manifest로 실현할 수 있다.

애플리케이션 캐쉬는 Expires 헤더를 설정하여 사용하는 것보다 좀더 많은 장점이 있다그리고 이러한 방법은 캐슁할 파일을 명확히 정리하여 사용할 수 있고따라서 브라우저가 특정자원이 사용되기 전에 미리 캐슁할 수 있기 때문에 실행 속도를 최적화 시킬 수 있다.

사이트의 구조를 탬플릿으로 생각해 보자이는 HTML의 구조는 그대로 유지하고 변경 가능한 데이터를 포함한다애플리케이션 캐쉬를 이용해서 사이트를 구성하는 HTML 템플릿들을 처리하고,  cache.manifest를 통해서 마크업을 캐슁한 후 컨텐츠의 업데이트는 JSON을 받아서 처리한다이와 같은 모델은 아이폰이나 안드로이드 Native 뉴스 앱이 하는 것과 아주 유사하다.

 이에 대한 가이드는 application cache tutorial을 참조해라.

  

n  6: 비주얼 처리를 개선하기 위해서 하드웨어 가속기능을 켜라 

가장 앞서고 있는 브라우저에서 많은 시각적 처리는 GPU-레벨 가속기능을 최대한 활동할 수 있다. GPU-레벨 가속기능은 고도의 동적 처리를 자연스럽게 처리하는데이는 Firefox Minefield IE9 그리고 사파리5에서 지원한다크롬은 현재 3D 변환 기능과 하드웨어 가속 기능을 윈도우 버전에서만 지원하며조만간 다른 플랫폼에서도 지원할 예정이다.

GPU 가속기능은 단지 아주 제한된 조건하에서만 동작한다그러나 3D 변환과 애니메이션 투명도는 이러한 기능을 기동시키기 위한 가장 일반적인 방법이다조심스럽게 이러한 기능을 켜는 방법은 아래와 같다. 

.hwaccel {  -webkit-transform: translateZ(0); }

 

그렇지만보장할 수는 없다. :)

지원되는 하드웨어 가속기능으로 애니메이션 변환(animated translation), 회전(rotation), 크기조정(scaling), 투명도는 확실히 부드럽게 표현될 것이다이들 효과는 층별 컨텐츠를 다시 그릴 필요없이 GPU로 직접 처리되는 장점을 가질 것이다그러나 페이지의 레이아웃에 영향을 주는 모든 프로퍼티들은 아직은 상대적으로 느리게 보일 것이다.

  

n  7: CPU에 부담을 많이 주는 오퍼레이션에 대해서는 웹 워커를 사용하라 

웹워커는 두가지 중요한 장점을 갖는다. 1) 속도가 빨라진다. 2) 태스크들을 수행하는 동안에도 브라우저는 반응할 수 있는 상황을 유지한다.  워커에 대한 데모는 HTML5 Slide Deck을 참고해라

웹워커를 사용하기에 적합한 몇몇 상황들은 아래와 같다. 

-       긴 문서의 테스트 포맷팅(Text formatting of a long document)

-       문법 강조(Syntax highlighting)

-       이미지 처리(Image processing)

-       이미지 합성(Image synthesis)

-       대량의 배열 처리(Processing large arrays)

 

 

n  8: HTML5 폼 애트리뷰트와 Input 타입 

HTML5에는 search, tel, url, email, datetime, date, month, week, time, datetime-local, number, range, color 등 새로운 input type들을 추가됐다현재까지는 이들 기능지원에 대한 브라우저간의 편차가 크며단지 오페라만 대부분 기능을 지원하고 있다따라서 이러한 기능을 사용할 때 접속하는 브라우저의 지원여부를 확인해서 절절한 처리를 해주어야 한다.

추가적으로 HTML5에 폼과 관련하여 입력 폼의 기본값을 사용자에게 흐릿하게 보여주는placeholder와 페이지를 로딩한 후 입력박스에 자동으로 커서를 위치시키는 autofocus 애트리뷰트가 추가되었다또한 사용자 입력 값의 검증 기능과 관련해서 사용자가 입력을 했는지를 검증해 주는 required 애트리뷰트 그리고 입력 값 검증을 위한 패턴을 표현하는 pattern 애트리뷰트가 추가되었다. Pattern 애트리뷰트에 자바스크립트 정규식으로 패턴을 정의하면 브라우저가 사용자가 입력한 값이 정의된 패턴에 맞는지 검증을 자동으로 해준다예를들어 이메일 주소 같은 것을 이러한 pattern 애트리뷰트를 이용해서 쉽게 검증할 수 있다이러한 기능을 사용하면 자바스크립트로 코드를 상당히 줄일 수 있으며 브라우저 내장된 기능으로 처리하기 때문에 속도가 빠르다.

이와 관련된 데모는 HTML5 Slide deck을 참고해라.

 

n  9: 이미지 효과를 표현할 때 CSS3 effects를 최대한 활용해라 

CSS3는 지금까지 정밀한 시각적 디자인 표현을 위해 사용하던 이미지 처리들을 대체할 수 있는다양한 종류의 기능을 제공한다. 2K 크기의 이미지를 100 Byte CSS로 대체하는 것은 큰 장점이다물론 추가적인 HTTP 요청이 필요없는 장점도 생긴다활용하기 좋은 CSS의 몇가지 주요 효과들은 아래와 같다. 

l  Linear and radial gradients

l  Border-radius for rounded corners

l  Box-shadow for drop shadows and glow

l  RGBA for alpha opacity

l  Transforms for rotation

l  CSS masks

 

예를들어 gradients를 이용해서 아주 우아한 버튼을 만들 수 있으며 이미지로 처리하던 다양한 효과들을 대체할 수 있다이와 같은 기능들은 대부분의 브라우저들이 안정적으로 지원하고 있다또한 이런 기능을 지원하는 않는 브라우저에 대한 처리는 Modernizr와 같은 라이브러리를 이용하여 체크하고 대응되는 이미지를 준비하여 처리하면 된다.

 

n  10: XHR보다 적은 밴드위스로 빠르게 전달할 수 있는 웹소켓 

웹소켓은 Comet의 인기가 급증하는 것에 대응해서 설계되었다지금은 XHR 모델 기반의Comet 대신에 웹소켓을 사용하는 것이 좋다. 

웹소켓은 간결한 프레임을 사용하기 때문에 XHR 보다 훨씬 적은 bandwidth를 소비한다몇몇 리포트에 따르면 유선 환경에서 35% 정도의 바이트가 줄어든다고 한다추가적으로 메시지를 전송할 때 큰 크기를 대상으로 하면 성능의 차이가 훨씬더 명확해진다시험에서 XHR이 웹소켓보다 3500% 정도의 전송 시간이 더 필요한 것으로 평가되었다최근에 에릭슨 실험실은 웹소켓의 시험을 통해 HTTP 기반의 ping 시간이 웹소켓에 비해 3 ~ 5배 정도 길다는 것을 확인했다따라서 에릭슨에서는 웹소켓이 실시간 애플리케이션에 확실히 더 적절하다는 것으로 결론을 내렸다.

 

n  추가적인 자원들 

성능측정을 위해 파이어폭스의 Page Speed 플러그인그리고 YSlow를 사용할 수 있다추가적으로 Speed Tracker for Chrome DynaTrace Ajax for IE는 좀더 세부적인 분석 정보를 제공한다.

Chrome Developer Tools에 대한 가이드 Resource Tab과 조만간 출시될 새로운 Audits panel을 통해 제공할 것이다.

저작자 표시 비영리 변경 금지
Posted by 이원석(wonsuk73@gmail.com)

댓글을 달아 주세요

  1. 이전 댓글 더보기
  2. 임웅 2011/02/22 14:57  댓글주소  수정/삭제  댓글쓰기

    항상 좋은 글들 잘 보고 있습니다. 세미나 또 기획중에 있습니다. 더 많은 것 보여주십시오. ^^ 한번 찾아뵐게요..

  3. 김하 2011/02/22 20:38  댓글주소  수정/삭제  댓글쓰기

    안녕하세요, 좋은 글 잘 봤습니다 ^^
    html5 와 css3 이용해서 모바일웹 프로젝트를 진행중인데요..
    그럼 안드로이드폰에서는 css3 transform 3d를 구현하지 못하는건가요?
    큐브를 테스트해봤더니 ios에서는 구현이 되고 안드로이드 디바이스에서는 z 값 표현이 안되더라구요..

  4. lanette 2012/03/06 08:05  댓글주소  수정/삭제  댓글쓰기

    물결은 우 만다

  5. more info here 2012/04/04 03:13  댓글주소  수정/삭제  댓글쓰기

    멈춘엘베이터서내린 아이는 정신이뛰어 라갔는

  6. web designer 2012/04/19 21:56  댓글주소  수정/삭제  댓글쓰기

    큐브를 테스트해봤더니 ios에서는 구현이 되고 안드로이드 디바이스에서는 z 값 표현이 안되더라구요..

  7. áo thời trang 2012/04/19 21:57  댓글주소  수정/삭제  댓글쓰기

    안녕하세요, 좋은 글 잘 봤습니다 ^^
    html5 와 css3 이용해서 모바일웹 프로젝트를 진행중인데요..

  8. magento themes 2012/04/19 21:57  댓글주소  수정/삭제  댓글쓰기

    멈춘엘베이터서내린 아이는 정신이뛰어 라갔는

  9. tấm cách nhiệt 2012/05/23 23:38  댓글주소  수정/삭제  댓글쓰기

    좋은 글 잘 봤습니다..
    앞으로도 좋은 정보 많이 기대하겠습니다.

  10. Thao Dien Pearl 2012/05/25 10:12  댓글주소  수정/삭제  댓글쓰기

    알려 줘서 고마워

  11. Saigon Pavillon 2012/06/01 20:54  댓글주소  수정/삭제  댓글쓰기

    Cảm ơn đã chia sẻ! mình xin ké xíu nhé !

  12. era town 2012/06/05 09:07  댓글주소  수정/삭제  댓글쓰기

    좋은 글 감사합니다! HTML5에 관심이 지대하게 많은 1인에게 큰 도움이 되셨어요! :)

  13. Tropic Garden 2012/06/05 09:08  댓글주소  수정/삭제  댓글쓰기

    나는 당신에게 동의 완전히 ^_^ 게시 고맙습니다!

  14. free premium wordpress themes 2012/06/06 01:32  댓글주소  수정/삭제  댓글쓰기

    html5 와 css3 이용해서 모바일웹 프로젝트를 진행중인데요..

  15. Design Inspiration 2012/06/06 01:33  댓글주소  수정/삭제  댓글쓰기

    항상 좋은 글들 잘 보고 있습니다. 세미나 또 기획중에 있습니다. 더 많은 것 보여주십시오. ^^ 한번 찾아뵐게

  16. free premium joomla themes 2012/06/06 01:34  댓글주소  수정/삭제  댓글쓰기

    좋은 글 감사합니다! HTML5에 관심이 지대하게 많은 1인에게 큰 도움이 되셨어요! :)

  17. free premium joomla templates 2012/06/06 01:34  댓글주소  수정/삭제  댓글쓰기

    좋은 글 잘 봤습니다..
    앞으로도 좋은 정보 많이 기대하겠습니다.

  18. Web Tips 2012/06/06 01:35  댓글주소  수정/삭제  댓글쓰기

    그럼 안드로이드폰에서는 css3 transform 3d를 구현하지 못하는건가요?
    큐브를 테스트해봤더니 ios에서는 구현이 되고 안드로이드 디바이스에서는 z 값 표현이 안되더라구요..

  19. tui xach 2012/06/06 01:36  댓글주소  수정/삭제  댓글쓰기

    안녕하세요, 좋은 글 잘 봤습니다 ^^

  20. ao kieu 2012/06/06 01:36  댓글주소  수정/삭제  댓글쓰기

    그럼 안드로이드폰에서는 css3 transform 3d를 구현하지 못하는건가요?

  21. era town 2012/06/29 10:07  댓글주소  수정/삭제  댓글쓰기

    명확히 브라우저에 보내지는 바이트 수는 CSS 기반 애니메이션을 사용할 때가 훨씬 적다.

  22. ket sat 2012/07/20 23:37  댓글주소  수정/삭제  댓글쓰기

    また、リンクが片側だけの場合がトラックバックススパムというようですが、アクセスを増やすためには、「こちらにリンクをわざわざ貼らない」のではなく、リンクを互いにはる方法で数を増やす手もあると思います。相手かまわず。そういうスパムはないのでしょうかというのが疑問です。もし行われていないとすれば、相手のリンクを貼れば目的が果たせるのに

  23. giam beo bung 2012/08/11 11:32  댓글주소  수정/삭제  댓글쓰기

    감사합니다, 나는하거나 기사, 에세이를 읽고

  24. tri seo 2012/08/11 11:39  댓글주소  수정/삭제  댓글쓰기

    나는, 아주 중요한 문서를 여러분의 게시물을 읽고, 나는 더 자주 다른 게시물을 추적할 것입니다, 감사합니다

  25. mun thit 2012/08/11 11:43  댓글주소  수정/삭제  댓글쓰기

    항상 좋은 글들 잘 보고 있습니다. 세미나 또 기획중에 있습니다. 더 많은 것 보여주십시오. ^^ 한번 찾아뵐게요..

  26. the voice viet nam 2012/08/11 12:12  댓글주소  수정/삭제  댓글쓰기

    좋은 글 감사합니다! HTML5에 관심이 지대하게 많은 1인에게 큰 도움이 되셨어요! :)

  27. giong hat viet 2012/08/11 12:14  댓글주소  수정/삭제  댓글쓰기

    항상 좋은 글들 잘 보고 있습니다. 세미나 또 기획중에 있습니다. 더 많은 것 보여주십시오. ^^ 한번 찾아뵐게요..

  28. xoa hinh xam 2012/08/13 11:38  댓글주소  수정/삭제  댓글쓰기

    있습니다항상 좋은 글또 기획중에주십시오. ^^ 한번 찾아뵐게들 잘 보. 더 많은 것 보여고 있습니다. 세미나

  29. hut mo bung 2012/08/15 15:49  댓글주소  수정/삭제  댓글쓰기

    보내지는 바이트 수는 CSS 기반 애니메이션을 사용할 때가

  30. tri tan nhang 2012/08/15 15:49  댓글주소  수정/삭제  댓글쓰기

    습니다. 세미나 또 기획중에 있습니다. 더 많은 것 보여

  31. tri nam 2012/08/15 15:50  댓글주소  수정/삭제  댓글쓰기

    고 있습니다. 세미나 또 기획중에

  32. Acompanhantes 2012/08/25 04:08  댓글주소  수정/삭제  댓글쓰기

    나는, 아주 중요한 문서를 여러분의 게시물을 읽고, 나는 더 자주 다른 게시물을 추적할 것입니다, 감사합니다

  33. can ho saigon pearl 2012/09/16 02:00  댓글주소  수정/삭제  댓글쓰기

    에라잇 르것다 섬세한 조각씨하나만큼은대하~ 단!

  34. www.roomdividersco.com 2012/11/20 15:50  댓글주소  수정/삭제  댓글쓰기

    항상 좋은 글들 잘 보고 있습니다. 세미나 또 기획중에 있습니다. 더 많은 것 보여주십시오. ^^ 한번 찾아뵐게요..

  35. frontdoorshq.com 2012/12/04 02:42  댓글주소  수정/삭제  댓글쓰기

    브루가가들조각했는데 실수을리는없.....에라잇 르것다 섬세한 조각씨하나만큼은대하~ 단!

  36. chuyen phat nhanh 2012/12/24 13:01  댓글주소  수정/삭제  댓글쓰기

    매우 유용 문서를 참조하십시오. 제가 HTML5을 이해 찾고 있는데, 그것은 많은 사람들이 흥미있다

  37. áo khoác nữ 2012/12/24 23:04  댓글주소  수정/삭제  댓글쓰기

    HTML5는 재미 배웁니다. 많은 기능과 부하 매우 빠른 속도가

  38. Hombre Timberland 2012/12/25 16:05  댓글주소  수정/삭제  댓글쓰기

    La chanteuse américaine Shania Twain s'est mariée, http://www.timberlandbaratas.com Mujer Timberland, à Puerto Rico, http://www.timberlandbaratas.com outlet timberland, samedi, http://www.timberlandbaratas.com timberland, rapporte le site spécialisé dans les célébrités TMZ, http://www.timberlandbaratas.com botas timberland.com, http://www.timberlandbaratas.com zapatos timberland, le jour-même, http://www.timberlandbaratas.com barato timberland. People David Arquette en désintoxication People Nouvel album de Lady Gaga : 23 maiRelated articles:


    http://iyoonsmom.tistory.com/9715 The business district is not far from the ocean view hotels and transportation to get into the city

    http://mizycenter.tistory.com/180 Le site "Créateurs de possibles"

  39. ssg real 2013/01/20 22:52  댓글주소  수정/삭제  댓글쓰기

    안녕하세요, 좋은 글 잘 봤습니다 ^^

  40. Iconia PC tablet dengan Windows 8 2013/02/18 19:54  댓글주소  수정/삭제  댓글쓰기

    クをわざわざ貼らない」のではなく、リンクを

  41. Cipto Junaedy 2013/02/18 19:55  댓글주소  수정/삭제  댓글쓰기

    けの場合がトラックバックススパムというようですが

  42. Cipto Junaedy ebook 2013/03/16 11:01  댓글주소  수정/삭제  댓글쓰기

    큐브를 테스트해봤더니 ios에서는 구현이 되고 안드로이드 디바이스에서는 z 값 표현이 안되더라구요..

  43. percakapan bahasa inggris 2013/03/16 11:04  댓글주소  수정/삭제  댓글쓰기

    html5 와 css3 이용해서 모바일웹 프로젝트를 진행중인데요..

  44. 2013/06/12 17:59  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

  45. critical review essay 2014/01/12 23:48  댓글주소  수정/삭제  댓글쓰기

    빛은 샘플로 가득 베트 통해 빛난다.시료에 의해 흡수되는 빛의 양을 측정한다. 화합물은 다양한 스펙트럼 범위의 광을 흡수하기 때문에, 오른쪽 파장은 분석을 위해 설정되어야한다.

  46. penjualan online 2014/01/30 16:56  댓글주소  수정/삭제  댓글쓰기

    비밀번호 비밀글

  47. Grosir Sprei Murah Berkualitas 2014/04/02 18:17  댓글주소  수정/삭제  댓글쓰기

    html5 와 css3 이용해서 모바일웹 프로젝트를 진행중인데요..

  48. acompanhantes sp 2014/04/30 06:32  댓글주소  수정/삭제  댓글쓰기

    디바이스에서는 z 값 표현이 안되더라구요

  49. ssg tower 2014/05/09 21:00  댓글주소  수정/삭제  댓글쓰기

    구현이 되고 안드로이드 디바이스에서는 z 값 표현이



티스토리 툴바