이미 소장하고 있다면 판매해 보세요.
|
01장 Ajax의 성능 제대로 이해하기
Trade-offs: 얻는 것이 있으면 잃는 것이 있다 최적화의 원칙 Ajax 브라우저 Wow!(우와!) 자바스크립트 요약 02장 빠른 웹 응용프로그램 만들기 그럼 대체 얼마나 빨라야 빠른 것일까? 지연 시간 측정 - 지연 시간이 길어져 문제가 될 때 스레드 사용 빠른 응답 속도를 보장하는 방법 - Web Workers - Gears - 타이머 - 메모리 사용이 응답 시간에 미치는 영향 - 가상 메모리 - 메모리 문제 해결하기 요약 03장 초반 다운로드를 분산시키기 그 외 모든 것들 쪼갬으로 인해 얻는 이득 어디를 쪼개면 될까 미정의 심볼과 경쟁 상태 사례 연구: Google 캘린더 04장 블로킹 없이 스크립트 로드하기 스크립트 블록 스크립트를 사이좋게 만드는 방법 - XHR Eval - XHR Injection - Iframe 안의 스크립트 - 스크립트 DOM Element - 스크립트 지연 - document.write 스크립트 태그 브라우저의 작업 중 표시 순서대로 실행되도록(또는 실행되지 않도록) 하기 지금까지의 결과를 정리해보면 그럼 최종 승자는? 05장 비동기 스크립트와 결합시키기 코드 예제: menu.js 경쟁 상태 비동기 방식으로 순서 보존하기 - 제1 기법: 하드 코딩된 콜백 - 제2 기법: Window Onload - 제3 기법: 타이머 - 제4 기법: 스크립트 Onload - 제5 기법: 나쁜 스크립트 Tags 여러 외부 스크립트 - 관리 XHR - DOM Element와 Doc Write 일반적인 해결책 - 단일 스크립트 - 복수의 스크립트 비동기 로딩의 실제 사용 예 - Google Analytics와 Dojo - YUI Loader 도구 06장 인라인 스크립트를 올바르게 배치하기 인라인 스크립트 블로킹 - 인라인 스크립트를 맨 밑으로 옮겨라 - 스크립트의 실행을 비동기적으로 시작하라 - 스크립트 지연 사용하기 CSS와 자바스크립트의 순서 보존하기 위험: 인라인 스크립트 바로 다음에 오는 스타일시트 - 인라인 스크립트가 블로킹되는 경우는 거의 없다 - 인라인 스크립트는 스타일시트로 인해 블로킹된다 - 실제로도 일어난다 07장 효율적인 자바스크립트 작성 유효 범위 관리 - 지역 변수 사용하기 - 유효 범위 체인의 증가 효율적인 데이터 접근 실행 경로 제어 - 빠른 조건문 - 빠른 반복문 문자열 최적화 - 문자열의 연결 - 문자열들의 공백 제거 오랜 시간 동작되는 스크립트를 피하라 - 타이머를 이용하여 유연하게 만들기 - 유연한 작업을 위한 타이머의 패턴 요약 08장 코멧을 이용한 확장 코멧 구현하기 전송기술 - 폴링 - 롱 폴링 - 포에버 프레임 - XHR 스트리밍 - 미래의 전송기술 크로스 도메인 추가적인 고려사항 - 커넥션 관리 - 성능 측정 - 프로토콜 요약 09장 Gzip을 넘어서 무엇이 문제인가? 원인은 무엇인가? - 빠른 검토 - 범인 - 범인의 실체 이러한 사용자를 어떻게 도울 수 있을까? - 압축되지 않은 크기의 최소화 - 사용자를 가르쳐라 - Gzip 지원의 직접적인 감지 10장 이미지의 최적화 이미지 최적화를 단순화하기 위한 두 단계 이미지 포맷들 - 배경지식 - 이미지 타입들의 특징 - PNG에 대해서 자동화된 무손실의 이미지 최적화 - PNG 크러싱 - JPEG의 메타데이터 제거 - GIF에서 PNG로 변환하기 - GIF 애니메이션의 최적화 - Smush.it - 큰 이미지를 위한 JPEG의 로딩기능 알파 투명: AlphaImageLoader를 피해라 - 알파 투명의 효과 - AlphaImageLoader - AlphaImageLoader의 문제 - 단계적인 PNG8의 알파 투명도 자르기(Sprite)의 최적화 - 사용자 스프라이트와 모듈 스프라이트와의 비교 - CSS 스프라이트의 최적화 다른 이미지의 최적화 - 확장 가능한 이미지를 피해라 - 애플리케이션에서 생성된 이미지들 - 파비콘 - 애플 터치 아이콘 요약 11장 도메인의 공유 크리티컬 경로 도메인 공유는 무엇인가? HTTP/1.0의 다운로드 도메인 공유의 동작 - IP주소와 호스트이름 - 도메인의 개수 - 리소스를 어떻게 나누어야 하는가? - 새로운 브라우저들 12장 플러시를 통해서 문서 먼저 내리기 헤더의 플러시 출력 버퍼링 청크 인코딩 Flush와 Gzip 다른 중개자들 플러시 동작 중 발생되는 도메인 블로킹 브라우저: 마지막 장애물 PHP 외의 플러시 작업 플러시 체크리스트 13장 아이프레임의 자제 가장 비싼 DOM 개체 Onload 이벤트를 지연시키는 아이프레임 아이프레임과 동시 다운로드 - 아이프레임 이전의 스크립트 - 스타일시트 앞에 있는 아이프레임 - 스타일시트 뒤에 있는 아이프레임 호스트이름에 할당되는 커넥잼 - 아이프레임 안에서의 커넥션 공유 - 새 창과 탭을 통한 커넥션 공유 아이프레임의 비용에 대한 요약 14장 CSS 선택자의 단순화 선택자의 타입 - ID 선택자 - 클래스 선택자 - 타입 선택자 - 이웃 선택자 - 자식 선택자 - 하위 선택자 - 전체 선택자 - 속성 선택자 - 유사 클래스 선택자 CSS 선택자의 효율적인 사용 - 오른쪽 먼저 - 효율적인 CSS 선택자의 사용 CSS 선택자의 성능 - 복잡한 선택자의 성능 이슈 - 피해야 하는 CSS 선택자 - 리플로우 시간 실 사이트에서의 CSS 선택자 부록 성능 관리 도구 패킷 분석 도구 - HttpWatch - 파이어버그 넷 패널 - AOL 페이지테스트 - VRTA - IBM 페이지 디테일러 - Web Inspector 리소스 패널 - 피들러 - 찰스 - 와이어샤크 웹 개발 도구 - 파이어버그 - Web Inspector - 인터넷 익스플로러 디벨로퍼 툴바 성능 분석 도구 - YSlow - AOL 페이지테스트 - VRTA - neXpert 기타 도구들 - 햄머헤드 - Smush.it - Cuzillion - UA 프로파일러 |
|
시간이 지나면서 웹은 더욱더 똑똑해져 가고 있고 사용자의 눈높이는 더욱더 높아져만 가고 있다. 때문에 개발자들은 보다 페이지를 가볍고 빠르게 만들어야 하고 그만큼 더욱 더 풍부하고 다양한 기능들을 제공해야만 하는 것이 현실이다. 즉, 웹의 기능은 더욱 더 서버 단에서 UI 단으로 옮겨져 가고 있으며 미래에는 지금보다 더 많은 시간을 할애해야 할 것이다. 회사에서 그 회사 제품을 팔지 못하면 경쟁력을 잃게 되듯이 개발자 또한 자신의 기술을 회사에 팔지 못한다면 경쟁력을 잃게 된다. 하지만 여기서 중요한 것은 회사의 제품보다 개발자의 경쟁력을 잃게 되는 속도가 훨씬 더 빠르다는 것이다. 이렇게 변해가고 있는 IT 트랜드 속에서 스티브 사우더스의 경험이 고스란히 녹아있는 이 도서는 개발자의 경쟁력에 있어서 더할 나위 없이 소중한 도서라 생각한다.
이 도서를 번역하면서 무엇보다도 책의 깊이와 규모에서 큰 감명을 받았다. 그만큼 실무에서 쌓은 경험을 조목조목 전달하는 사우더스 내공에 칭찬을 아끼지 않는 바이다. 또한 이런 책이 국내에 출시될 수 있다는 것과 첫 번째 도서에 이어서 이렇게 두 번째 책을 번역할 수 있었던 것 또한 큰 영광이라 생각한다. 어쨌든 번역이라는 이 작은 노력을 통하여 많은 개발자들에게 조금이라도 보탬이 되었으면 하는 바람이다. --- '박경훈 옮긴이글' 중에서 본 책의 전판인 『웹사이트 최적화 기법』의 한국어판이 나온 지 이제 벌써 2년이 다 되어 가고 있다. 그동안 웹은 Ajax, HTML5 등 끊임없는 발전을 이루어 왔고 기존의 데스크톱 애플리케이션의 영역은 물론 이제 모바일까지 영역을 넓혀 가고 있다. 이젠 웹만으로도 기존의 컴퓨터로 하던 작업을 모두 할 수도 있을 정도며 웹 OS까지도 나오는 상태이다. 이렇게 날이 갈수록 중요해지고 화려해지는 웹을 사용자들이 더 편하고 빠르게 사용할 수 있도록 하는 것이 바로 우리 프론트엔드(Front-end) 엔지니어들에게 주어진 임무이다. 이 책의 전판을 통해 소개 된 많은 기법들에 이어 이 책에서 소개하는 기법들을 활용함으로써 더욱 더 빠르고 사용자들에게 편리한 웹사이트들이 더욱 더 많이 나올 수 있을 것이라 기대한다. 해외는 물론 국내 주요 포털들에서도 활용되고 있는 이 기법들을 통해 독자 여러분의 개발 하는 웹이 한 단계 업그레이드될 수 있었으면 하는 바람이다. --- '신형철 옮긴이글' 중에서 |
|
오늘날 웹사이트는 풍부한 사용자 경험을 제공하기 위해 Ajax를 비롯한 각종 첨단 웹 기술이 범람하는 곳이 되었다. 웹사이트를 더 사용자 친화적으로 만들고 풍부한 경험을 제공하기 위한 노력에 힘입어 웹사이트의 성능 문제는 더는 무시 못할 주제가 되었다. 웹이 보여준 성장만큼 주먹구구식이나 임시방편적인 웹사이트 성능 향상 비법은 이제 통하지 않는다. 좀 더 체계적이고 입증된 웹사이트 성능 향상 기법이 필요한 것이다.
전작 『웹사이트 최적화 기법: UI 개발자를 위한 필수 지침서』에 이어 이번에도 스티브 사우더스가 초고속 웹사이트 구축을 위한 금쪽같은 14가지 우수 사례를 들고 나왔다. 이번에는 주제를 크게 세 부분으로 나눠 각각 자바스크립트 성능(1~7장), 네트워크 성능(8~12장), 브라우저 성능(13, 14장)을 다룬다. 또 이 중 6개 장은 각 분야의 전문가가 직접 집필한 내용이라 훨씬 더 많은 통찰력을 제공할 것이다. 저자는 이 책에서 소개한 기술을 활용하여 세계에서 가장 인기 있는 사이트 중 일부가 부하를 60%까지 줄일 수 있었다고 전한다. 달리 말하면 아무리 잘 만든 사이트라도 사용자를 불편하게 해서는 절대 성공할 수 없다는 말이다. 성공은 특별한 곳에 있지 않다. 자그마한 노력이 하나하나 모여 성공적인 웹사이트, 초고속 웹사이트를 일궈 나가는 방법을 이 책에서 확인해 보길 바란다. 성능은 웹사이트의 성공에 있어서 굉장히 중요한 척도이며 오늘날의 웹 애플리케이션들은 Ajax와 같은 기술을 활용하여 굉장히 풍부한 내용들을 브라우저에 표현하고 있다. 이 책에서는 구글의 웹 성능 전도사이자 이전 야후 성능의 최고 권위자였던 저자 스티브 사우더스의 경험을 토대로 한 웹사이트의 성능을 최적화하는 다양한 기술들을 전달하고 있다. 사우더스의 이전 도서인 『웹사이트 최적화 기법』(High Performance Web Sites)은 당시 최고의 베스트셀러였으며 웹 개발에 있어서 바로 클라이언트 단의 로드 속도가 웹 성능에서 80%나 된다는 이야기를 통하여 굉장한 충격을 주기도 하였다. 이번 도서인 『초고속 웹사이트 구축』에서 사우더스는 8명의 전문가와 함께 실용적인 최고의 팁들을 제공하고 있다. 이 책에서 다루는 내용 중 주요한 내용 세 가지는 다음과 같이 나누어 볼 수 있다. 자바스크립트: Ajax 성능을 이해, 효율적인 자바스크립트 작성방법, 즉각 반응하는 웹 애플리케이션, 다른 구성요소의 방해 없이 로딩되는 스크립트들 등과 같은 여러 조언들을 들을 수 있다. 네트워크: 여러 도메인을 통하여 리소스들을 공유하는 방법, 퀄리티의 손실 없이 이미지 크기를 줄이는 방법, 청크 인코딩을 통하여 더 빠르게 렌더링하는 방법들에 대해서 살펴본다. 브라우저: IFrame의 대안, CSS 선택자를 어떻게 간단히 이용할 것인가 등과 같은 다양한 내용을 살펴본다. 오늘날의 웹 2.0 기반의 웹사이트와 또한 풍부한 미디어를 제공하는 웹사이트에 있어서 속도는 필수적인 기술이다. 이 책을 통하여 웹사이트의 속도를 어떻게 낮출 수 있고 또한 더 빠르게 반응하기 위한 내용들을 배울 수 있을 것이다. |