야후 블로그 사용자 인터페이스 (YUIBlog)

Satyam 요청 - 그리고 Packt에서 새 YUI 2.8 도서의 무료 사본을받을 수

Satyam (다니엘 페레로)가 지난 주 쓴 작문 자신의 경험에 대한 YUI 2.8을 : 라이브러리 학습 , 새로운 YUI이 현재 사용 가능 Packt에서 볼륨.

Packt은 아낌없이에 대한 몇 가지 무료 전자 사본을 제공했다 YUIBlog 이 게시물에 댓글로 2.8 관련 주제 YUI에 Satyam에서보고 싶은 질문이나 튜토리얼을 제안한다. 독자를, 그리고 Satyam이 다음 중 하나에 대한 제안 주제를 예상한다면 세명의 "질문하기 Satyam"블로그 게시물 Packt는 다운로드를 사용할 수 Satyam의 도서의 전자 복사본을 만들 것입니다.

Satyam는 다음 달 정도에 걸쳐 블로그에 여기 세명의 좋아하는 질문에 대한 답변을 게시합니다.

: 대화 찾기 bloglines | 테크노를

공유 및 확장 : del.icio.us로 스크랩 | 디그 그것! | 레딧!

YUI 3.2.0 미리보기 릴리스 1 : 터치 이벤트 지원, 제스처, 전환, CSS 그리드, ScrollView, 업로더, 및 기타

YUI 참여자의 팀은 곧 YUI 3.2.0 릴리스의 첫 번째 개발자 미리보기를 발표하게 된 것을 기쁘게 생각합니다. 이 미리보기는 개발자와 잠재 regressions의 릴리스를 테스트 있도록하여 새로운 기능과 구성 요소에 대한 피드백을 제공하는 implementers 수있는 기회를 제공합니다. 당신이 기존 YUI 구현이있다면, 개발 환경에서 YUI 3.2.0pr1을 행사하고 우리가 당신이 찾아내는 무엇 알려주시기 바랍니다.

미리보기 릴리스를 시작하는 방법에는 세 가지가 있습니다 :

• CDN에서 사용 YUI 3.2.0pr1는 3.2.0pr1 버전 태그를 통해 CDN에서 사용할 수있는 - 당신이 원한다 미리보기 릴리스 파일을 참조할 수 있도록 http://yui.yahooapis.com/combo?3.2.0pr1/build/yui/yui-min.js . 당신은 시험판이 씨앗 파일을 전환하면, 이후의 모든 use() 구문은 YUI 3.2.0pr1를로드하는 것입니다.
• 에서 다운로드 YUI 3.2.0pr1 : 릴리스 다운로드 YUILibrary.com -이 릴리스의 새로운 포함, 소스 코드와 모든 구성 요소에 대한 예제를 포함합니다.
• 예제를 탐험해 : 편의, 우리는 게시한 미리보기 (와 함께 작동하는 예제 명단 YUIBlog로). 귀하의 CDN 버전 참조 (또는 미리 다운로드)를 스위칭 및 자신의 환경에서 그것을 테스트하는 전주곡으로 거기에 릴리스를 탐험하시기 바랍니다.

YUI 3.2.0에서 주목할만한 변경 예정

모든 YUI 개발 작업과 마찬가지로, 당신은 우리의 현재의 계획과 진행 상황 추적하실 수 있습니다 우리 YUI 3 tasklist에서 YUI 3.2.0의 포괄적인 목록 (및 일부 다가오는 3.3.0) 변경 사항을 포함을, 당신은 또한 문제를 해결해 우리의 진보에 확인하실 수 있습니다 버그 데이터베이스에 . 여기 3.2.0 개발자 미리보기에 등장하는 새로운 업데이트된 구성 요소의 일부는 다음과 같습니다

• 터치 이벤트에 대한 본질적인 지원 (추가되었습니다 mynode.on("touchstart", function(e) {}); ). - 우리는 두가지 번들 제스처와 제스처 모듈 추가했습니다 gesture-flick 와 gesture-move - 모두 터치와 마우스 구동 장치와 함께 작동합니다. API 문서 또는 체크 아웃 제공된 예제 페이지 제스처를 사용하여 시작하는 방법에 대한 아이디어를합니다.
• YUI의 본질적 로더는 이제 능력을 기반 로딩을 지원합니다. 이것은 우리가 별도의 submodules로 예를 들면, IE 특정 코드를 분리하고 로더는 그것을 필요로 브라우저를 위해 코드를 번들 수 있도록 할 수 있습니다. 우리는 비 IE 브라우저의 DOM 모듈 필요없이 코드를 변경 현대적인 브라우저의 모든 사용자에게 혜택을 성능 / K - 무게 향상에 배송 IE 특정 코드를 피하기 위해이 새로운 기능을 활용 있어요.
• YUI 3의 애니메이션 포트폴리오는 이제 처리 전환이 강력한 하드웨어 가속 (가능한) 기술에 대한 브라우저 정상화를 제공, 전환 모듈을 통해 전환을 지원, 샘플 코드에 대한 예제를보세요 . 애니메이션은 가장 기본적인 형태로, 크게 더 브라우저에서 간단한 애니메이션을위한 K - 무게를 감소, 현대 브라우저를위한 간소화된 종속 트리가 있습니다.
• YUI 3.2.0 그걸로 YUI의 CSS 그리드 컴포넌트의 새로운 베타 버전을 가져올 것입니다, 당신은 미리보기 릴리스에서 격자에이 새로운 접근 방식을 탐험하실 수 있습니다. 예제 시작할 수있는 가장 좋은 장소가 .
• 우리는 YUI 3.2.0에 새 (베타) ScrollView 위젯을 제공할 야후 모바일 엔지니어링 팀의 마이클 존스턴과 함께 일했습니다. ScrollView 처음이나 한도를 종료하기 위해 스크롤 할 때 요소의 탄력을 에뮬레이트, 네이티브 애플 IOS 응용 프로그램의 사용자에게 익숙한 스크롤 창 구현을 제공합니다. 당신이 보게 될거야 ScrollView에 대한 3.2.0pr1 예제 마우스뿐만 아니라 Android 나 IOS 장치에 터치 이벤트가 잘 작동이 구성 요소가 장치 중립적입니다.
  
• YUI 2 업로더 구성 요소 3.2.0의 베타 버전으로 debuting뿐만 이제 YUI 세 가족의 일부입니다.
• YUI 두 버전의 포트습니다 YUI 3.0.0, 함께 데뷔 역사 모듈은 (는대로 YUI 3.2.0에서 사용할 수있는 남아 중지되었습니다 history-deprecated .) 새로운 베타 연혁 유틸리티 debuts는 3.2.0에 YUI 3 갤러리에서 라이언 그루브의 역사 라이트 모듈을 기반으로. 새 구성 요소의 프리뷰 릴리스 예제 좋은 시작 참조입니다.
• JSONP와 YUI 3 갤러리에서 YQL 쿼리 모듈은이 릴리스에 베타로 debuting, 표준 구성 요소가되고 있습니다.

피드백

미리보기 릴리스의 목표는 가능한 한 쉽게 사회에 우리 모두가 곧 릴리스의 진행 상황을 평가하고 피드백을 제공할 수 있도록하는 것입니다. 3.2.0pr1을 테스트하고 우리가에서 티켓 제출하여 찾을는지 알려 드려야 할 시간이 좀 걸릴 바랍니다 YUI 3 버그 데이터베이스 "버전에서 관찰된"3.2.0pr1로 표시합니다. 우리에 대한 미리보기 릴리스 질문을 해결하기 위해 최선을 다하겠습니다 YUI 3 포럼 도.

: 대화 찾기 bloglines | 테크노를

공유 및 확장 : del.icio.us로 스크랩 | 디그 그것! | 레딧!

YUI 극장 Boxee, 차드 송구의 호의와 Brilaps 팀에 무리

YUI 기여하고 전 야후 채드 송구가 이끈다 프로젝트 - 그의 Brilaps 그룹과 그의 최신 프로젝트에 대해 알려주 우리를 이메일로 YUI 극장 Boxee를 통해 TV 화면. 차드의 단어 :

Boxee는 TV에 웹 콘텐츠를 유치하는 데 도움이 목표로 세상의 주목을 받고있는 크로스 플랫폼 응용 프로그램입니다. 이것은 오픈 소스 기반으로 XBMC 프로젝트 및 사용자 추가 콘텐츠에 가져다 새로운 플러그인을 쓸 수 있습니다. 우리의 첫 Boxee 플러그인을 구축하기 위해 약 3 주전에 새 프로젝트를 시작하고, 우리는 TV를 웹에서 가지고 싶었던 내용으로 YUI 극장을 선택했습니다. (성장)이 보관된 많은 멋진 동영상이 있습니다, 우리는 편안하게 볼 시간이있을 자신의 소파에서 (동영상의 대부분이 다른 사람보다 조금 더 특히 이후에 대한 액세스 권한을 가지고 개발자를위한 콘텐츠의 훌륭한 원인이라고 생각됩니다 그들의 랩탑에서). 그것은 플러그인, 그걸 폴란드어와 몇 가지 버그를 해결하기 위해 다른 주, 그리고 Boxee QA 팀에 의해 승인 신청을하려고 일주일을 구축하기 위해 일주일에 대한 정보를 가져다가 공개 저장소에 밀어. 난 그냥 오늘 아침 공개 저장소에 충돌하고 그래서 밖으로 도달하고 알려주고 싶었 해당 단어가 있어요.

이것은 즐기고있다 사람에 대한 환상적인 소식입니다 YUI 극장 콘텐츠를하고 그 / 그녀의 소파의 안락에서 더글러스 Crockford, 브렌든 Eich 모든 다른 훌륭한 YUI 극장 스피커에서 최신에 따라 싶습니다. 체크 아웃 위의 동영상을 벌이는 이동 다음 UI의 투어를하고, Boxee를 하고 시작.

: 대화 찾기 bloglines | 테크노를

공유 및 확장 : del.icio.us로 스크랩 | 디그 그것! | 레딧!

야후 플렉스 포스 팀 가능 프론트 엔드 엔지니어링 위치

야후! 플렉스 포스는 현재 몇 유능한 프론트 엔드 엔지니어와 함께 우리 팀을 확장 찾고 있습니다. 플렉스 포스 팀의 일환으로, 당신은 높은 프로파일과 높은 가시의 여러 전략적인 프로젝트에 협력할 수있는 기회를 갖게됩니다. 이러한 순위는 조직에 걸쳐 최상의 사례 및 지식 공유의 대사되고 포함됩니다. 우리는 최신의 전략, 기술 및 도구를 사용하기 위해, YUI 팀을 포함하여 서로 다른 플랫폼 팀,와 긴밀히 협력.

최근 예를 들어, 플렉스 포스 팀이 새로운의 구현 뒤에 야후! 업데이트 위젯 을 사용 전적으로 내장되어 있습니다 YUI 3 .

이 역할에서 성공하기 위해서는 빠르게 램프와 다른 도전에 걸릴 수있는 긍정적인 사고 (思考)와 함께 자기 시작하고 빨리 배우는해야합니다. 프런트 엔드 기술 및 모범 사례에 대한 진정한 열정도 필요합니다.

야후 플렉스 강제에 나와 내 동료들과 작업을하면, 야후 사이트에 경력 머리에 흥미로운 소리 다음과 같은 입장을 확인하는 경우 :

• 프론트 엔드 엔지니어 위치 # 1
• 프론트 엔드 엔지니어 위치 # 2
• 프론트 엔드 엔지니어 위치 # 3 - 이것은 경험과 필요한 추가 기술과 함께 좀 더 상급의 역할

: 대화 찾기 bloglines | 테크노를

공유 및 확장 : del.icio.us로 스크랩 | 디그 그것! | 레딧!

YUI : 개관 시간은 7월 21일 (수)

에 가입하지 않는 것이 당신들을 위해 YUI 달력 이나 YUILibrary.com 포럼 의 다음 할부 YUI : 개관 시간은 , 7월 21일 내일 것입니다.

어떻게 위젯을 빌드하는 방법과 YUI 3 방법으로 플러그인을 구축하려면 다음과 같이 우리가 자신의 모듈을 구축 시작지고 YUI 사회 기여자에 대한 되풀이 테마에 초점을가는이 시간.

앤서니 작은 옹기병, # YUI IRC 채널 명예의 일명 apipkin은 지난 해 동안 그의 learnings를 통해 우리를지도하고있는 권리를 만드는 걸 확신 느낌으로 YUI 3 문서 예제를 복사 및 붙여넣기에서 이동하는 방법을 보여주는 손님 것입니다 "사고 YUI 3 방식"에서 문제를 접근하는 방법에 대한 선택.

우리는 그의 간단 갤러리 모듈의 두 살펴 겁니다 버튼 위젯 과 노드 IO 플러그인 . 그 사람이 오늘 비교, 원래 어떻게 생겼는지를 토론하고, 왜 그들이 변경되었습니다.

그렇다면 우리는 잠시 주위를 플레이 할 것 전화에있는 사람이 커버하고 싶은에 따라 처음부터 뭔가를 빌드합니다.

YUI 팀에서 매트 스위니 (노드, 선택, TabView, 격자 등) 및 Satyen "전문가"Desai는 (위젯, 플러그인,베이스, 속성 등) 또한 호출에있을 것입니다. 그래서 집안에 모범 사례가있을 것입니다.

참여자 (아직?)되지 않습니다 YUI 3 소비자의 경우,이 호출은 여전히​​ YUI 세 위젯과 플러그인이 내장되어 있으며, 어떤 패턴의 새로운 YUI 구성 요소에서 기대하는 방법을 뒤에 생각을 이해하기위한 도움이 될 것입니다. 그리고 의심의 여지는 항상 다른 좋은 테이크 아웃 없을 것입니다.

우리는 오전 10 시부터 태평양 서머 타임 오후 12시로 온라인 상태가됩니다. 연결 내용은 정상적으로 동일합니다.

1. 1-888-371-8922 (미국 이외의 참가자는 지역 번호를 내게 이메일)에 접속
2. 참석자 코드 47188953을 입력합니다 #
3. 화면 공유 세션에 참가 (이것은 그것을 처음 사용하는 경우 이것이 당신이 어도비 연결 플러그인을 설치하라는 메시지가 나타납니다)

여기의 포럼 스레드에 이 개관 시간에 대한이. 내가 전화 후 흥미로운 테이크 아웃의 일부를 게시해 드리겠습니다.

따라 @ yuilibrary를 최신에 대해 트위터에.

거기서 당신을보고 싶습니다!

: 대화 찾기 bloglines | 테크노를

공유 및 확장 : del.icio.us로 스크랩 | 디그 그것! | 레딧!

작가 노트 : YUI 2.8을 쓰기 : Packt에서 라이브러리 학습, 새 YUI이 도서

2009 년 12 월에에서 편집자 Packt 게시 전에 자신의 책의 두 번째 버전을 작성하려는 경우 부탁 YUI의 도서관 . 원래의 저자 댄 Wellman은 당시 다른 기업에 종사하는, 그들은 널리 잘 알고 있던 작가 필요했습니다 YUI 2 . 내가 생각했던 제일 먼저했습니다 : 당신은 약간 늦은 거죠? 대부분의 YUI 3 GA에서 이미되었으며 더 모든 릴리스오고했습니다. 그러나 Packt 팀이 진행하고 싶어, 난 그 도전 받아하기로 합의했습니다.

7월 16일 ^일에서 새 볼륨이 나왔 YUI 2.8을 : 라이브러리 학습 하지 두 번째 버전으로하지만 새로운 타이틀로. 결국, 그것은 나쁜 결정되지 않았습니다. 이 책이 편집 과정을 통해가는 동안, YUI 3에서 YUI 두 구성 요소를로드하는 기능을 얻게 use() 구문을 . 모든 YUI 두 구성 요소의 YUI 3 버전을 생성하는 개발자에서 압력을하면서 이것은 광범위한 YUI이 카탈로그의 유용성을 확장합니다.

• 샘플 장 : Packt 당신에게 새로운 책 내용이 뭔지 맛을주는 그들의 웹사이트에, YUI 2.8 서식있는 텍스트 편집기를 덮고, 새로운 볼륨에서 샘플 챕터를 출시했습니다 .

이 새로운 볼륨의 목표는 모든 베타 버전이 아닌 YUI 두 구성 요소를 커버하는 것이었다. 이것은 광범위한 비전은 나에게 내가 전혀 사용하지 않을 거란 걸 간신히 그들의 가장 기본적인 형태뿐만 아니라 다른 사람에 사용했다 컴포넌트에 깊이 살펴 수밖에. 그러나 초판이 아니라 오랫동안 라이브러리가 공개 당했을 시작 프로젝트와 달리, 내가 YUI와 누적 경험을 몇 년 했어요 - 내 경험은 그들의 경험과 조언을 공유하는 많은 사용자의와 결합하여 포럼과 블로그. 나는 또한 Caridy Patiño 및 Iliyan Peichev는 또한 잘 알려진 YUI 제공자 두 누구의 리뷰어의 우수한 팀에 의해 많은 blunders에서 구했다고했다.

관리 길이로 도서를 유지하려면, 몇 가지 이미지, 긴 예제와에서 찾을 수있는 참고 자료 제거 YUI 웹사이트를 . 초판 장 당 최대 두 가지 구성 요소가 있었을 때, 새로운 하나는 최대 4 개의하고 새로운 챕터 몇있다. 그럼에도 불구하고, 일부 구성 요소는 절단을하지 않았다.

YUI 2의 진화

이 책을 쓰는 동안 저는 YUI 라이브러리에 대해 많은 것을 배웠습, 그리고 댄의 텍스트 변경 내용은 2006 년 출시된 이후 도서관의 진화에 대한 교육적했다.

예제 코드에 대한 프로그래밍 스타일이 몇 년 동안 변경되었습니다. 대신 네임 스페이스 (또는 사용하여 만드는 YAHOO.example 항상 자리 표시 자로 사용할 수 있습니다), 우리는 이제 DOM을 사용할되면 만들어 익명 함수 내에서 모든 맞게하는 경향이 있습니다. 우리가 절대적으로 이러한 우리는 사용자 정의 라이브러리 구성 요소를 만들 때와 같이 전 세계적으로 액세스할 변수를 (객체를 포함하여)를 작성해야 할 때 (이 스타일 우리가 YUI 3 보는 가까이됩니다.) 지금 네임 스페이스를 사용합니다. 우리가 YUI (DOM, 이벤트, 랭 일반적인 바로 가기) 또는 우리 자신의 변수에서 더 자주 사용하는 개체에 대한 기능 - 실력 발휘 별칭을 정의할 수 있기 때문에 Sandboxing는 우리에게 어떤 입력을 저장합니다. 이 접근법은 또한 수 있습니다 YUI 압축기가 훨씬 좋은 일을하고 있어요.

도서관의 전체의 전경을 갖는 것은 그것이 시간이 지남에 따라 개발 방법에 나를 통지 수있었습니다. 구성 요소의 아키텍처 변경하고 이제 다 YUI 3 무엇에 집중 얼마나 분명하다.

초기 구성 요소, TreeView와 같은 몇 가지 종속성을했다. 특정 패턴이 분명되기 시작할 때, 몇 가지 기본 구성 요소 인프라 개발을 시작했다. 컨테이너 가족이 있었 Config 수완과 세터 메소드를 사용할 객체를, 그래서 그것에서 상속하는 모든 구성 요소가 있습니다. 그것은 또한 우리가 YUI 2 사용 가능한 사용자 지정 이벤트를 사용할 수있는 두 가지 방법 중 하나입니다 사용자 정의 이벤트 객체를 사용합니다.

TabView의 출시와 함께 온 YUI 두 요소 유틸리티 개선 getters와 setters (AttributeProvider 경유)뿐만 아니라 더 나은 사용자 정의 이벤트 (EventProvider 통해) 제공. 일곱 다른 YUI 두 구성 요소는 요소에서 상속합니다. 진화 도서관에 보니, 그것은 요소 뒤에있는 아이디어는 DOM 요소의 래퍼로, YUI 3의 노드를 알려 온 방식을 볼 수 있습니다 간단합니다. 새로운 구성 요소가 모두 훨씬 더 강력하고 완벽한 각각 자신의 영역에 있지만 다른 구성 요소에 대한 근거로 요소의 역할은, YUI 3의 자료 및 위젯에서 망가 졌어요. 예를 들어, 노드의 all 과 one 요소의 동안 방법은 노드 인스턴스를 반환 getXxxx 방법이 완전히 DOM을 추상화 아닌 일반 DOM 요소 참조를 반환합니다.

한 손을 AttributeProvider 및 EventProvider, 다른 한편에있는 두 개의 모델 구성 및 CustomEvents 완전히 호환되지 않습니다. 메뉴 및 분할 버튼 버튼 요소에서 상속으로 두 모델은 공존하고는 컨테이너에서 상속 정규 메뉴를 개최하고 있습니다.

의심의 여지가없이, YUI 3이 경험으로부터 혜택을,하지만 YUI 2도 YUI3에서 benefitted. 멋진 물건 YUI 2 등 풍부 YUI 3 온 event-delegate 및 element-delegate 과 다른 새로운 이벤트 우리가들을 수 있습니다 ( focusin 및 focusout , mouseenter 및 mouseleave ). 이것은 또한 때문에 가능한 된 우리로드 구성 요소 방법 가장 중요한의 도입과 함께 - YUI 2의 수명 기간 동안 변경, YUI이 로더 - 그리고 YUI 3 클라이언트 사이드 로딩에 대한 본질적인 지원과 같은 공식되었다.

영향을 로딩하는 방법 구성 요소가 디자인했고 어떻게 최종 구성 요소 파일이 내장되어 있습니다. YUI 2에서, 뛰어난 서버 요청의 수를 최소화하기 위해, 구성 요소들은 함께 모여 필요한 물건만큼을했다. 따라서, 일부 구성 요소가 필요한 경우 별도의 부품이 너무 비용이 많이 드는했다 로딩 때문에 다른 하나의 파일에 포장 기능의 전체 범위 개체의 무리를 받았을 때하고 그들이 편리하도록 그들을 느슨하게 관련 개체를 가지고. 다음과 같은 집계 온 yahoo-dom-events.js 또는 reset-fonts-grids.css 그들이 거의 일정 불변하게 함께 사용하거나 있기 때문에 utilities.js 의 모든 자주 사용되는 컴포넌트를 수집 YAHOO.util 지점. 하지만 진짜 변화는 우리에게 하나의 HTTP 요청에 스크립트와 CSS 파일의 수를 각각 당겨 수 콤보 취급 요청과 함께. 그것은 구성 요소 파일에 라이브러리 및 가상 '평균 사용자에 따라 합산에 그에있는 개체의 포장을 최적화하기 위해 덜 필요합니다.

YUI 3 우리는 더 이상 한 번에 '컨테이너 가족'을 로드할 필요가 없습니다. 우리는 별도의로드 widget- xxxx 기본 상단에있는 파일을 widget 우리가 필요로하는 기능에 따라. 그 방식은 YUI 3 표준이지만, YUI 2의 진화 단계로 왔어요. 따라서 같은 최근 YUI 두 구성 요소가 event-delegate 및 element-delegate 자신의 기본 구성 요소에서 별도로 포장하고 있으므로 이벤트는 mouseenter 및 mouseleave . 우리는 더 이상 당신이 기능을 사용하면 원하는 페이지에서 불필요한 코드를두고 설정보다 구체적으로 선택할 수 있도록, 향후 릴리스의 라이브러리 구성 요소의 분리 볼 수 있습니다.

이것은 진보의 이야기, 어떤 실패의 노력하지만 반드시 간 과정이다. 적어도 AttributeProvider 및 EventProvider에, 왜 TreeView는 요소에서 상속하지 않거나 왜 메뉴 따라서 컨테이너를하지 않은, 그리고 요소를 전환 또는? 기술적으로, 대답은 '이전 버전과의 호환성'이지만,보다 일반적인 관점에서 그것은 '존중'입니다. YUI 두 구성 요소의 게시된 공용 인터페이스를 사용하여 웹사이트의 수천 (와 개발자 수만명의)가 있습니다. 이러한 변경 작업을하면 업그레 이드 경로를 여러 응용 프로그램을 깰 것이다하거나 잘라 것이다, 그들은 코드를 수정하거나 새로운 기능의 혜택을 원하는 것입니다. 설치된 코드베이스를 너무나 존경하는 것은 그 자체 라이브러리 기능입니다. 그 코드를 만드는 회사에 존경하는 것은, YUI 팀에있는 사람들의 기능, 난 그렇게는 아주 감사하고 있어요.

: 대화 찾기 bloglines | 테크노를

공유 및 확장 : del.icio.us로 스크랩 | 디그 그것! | 레딧!

모바일 브라우저의 캐시 제한 Revisited

에서는 모바일 브라우저 캐시 제한 : 안드로이드, IOS, 그리고 웹 OS , 나 안드로이드, IOS에서 브라우저 캐시 제한, 그리고 웹 OS 장치를 결정하기 위해 우리 시도의 결과를 공유했습니다. 문서의 끝 부분에, 나는 썼다 :

출발점으로 이러한 결과를 사용하지만, 모바일 캐시 제한에 대한 가정을 바탕으로 주요 결정을하기 전에 그들에게 자신을 확인합니다. 번개 속도로 모바일 브라우저의 세계 변화, 그래서이 연구는 매우 짧은 수명을 가지고 있습니다.

알고 보니, 그 좋은 조언되었습니다 문서는 게시 일 후 스티브 Souders은 그가 실제의 웹 워크플로우보다 대표습니다 다른 방법론을 사용하여 테스트를 실행했다하고 다른 결과가 나왔던 것을 댓글을 달았습니다.

새로운 방법론

특정 크기의 무작위로 생성 페이지로 직접 이동 관련된 내 원래의 방법은 함께 제공 text/html 콘텐츠 유형입니다. 이 방법론을 사용하여 결과 (웹 OS에서 제외) 안정적으로 재현할 수 있었으나, 스티브가 지적한대로, 사용자는 CSS와 자바 스크립트 파일을 직접 이동하지 않습니다. 외부 CSS와 자바 스크립트에 대한 제한이 잘못되었습니다로 HTML 리소스에 직접 탐색에 대한 제한이 동일한 것을 내 가정, 그래서 내 테스트 결과가 유효하더라도, 그들은 광범위하게 적용되지 않았습니다.

많은 IM 세션, 여러 이메일 및 전화 통화 부부의 과정 동안, 스티브와 나는 새로운 테스트 방법론을했습니다. 내가 위에 그것의 버전을 구현 캐시 테스트 프레임 워크 , 그리고 스티브는 버전 구현 결과를 게시 수 Browserscope을 .

새로운 테스트에서 우리는 무작위로 생성된 CSS 또는 특정 크기의 자바 스크립트 구성 요소를 참조하는 HTML 페이지를로드합니다. 그렇다면 우리는 그것이 캐시에서로드했는지 아닌지는 동일한 구성 요소와 검사를로드 두 번째 HTML 페이지로 이동합니다. 구성 요소가 캐시에서로드되었는지 확인하려면, 우리는 각 요청에 쿠키의 타임 스탬프를 저장하고, 타임 스탬프가 우리가 구성 요소를 로드할 두 번째 시간을 업데이 트하는 경우, 우리는 구성 요소가로드되지되었습니다 즉, 요청이 서버에 충돌 알고 캐시에서.

새로운 결과

우리는 우리가 테스트의 모든 모바일 브라우저들은 HTML 페이지 자체에 대한 것보다 페이지에서 로드한 외부 리소스에 대한 상당히 높은 캐시 제한을했다는 사실을 발견했습니다. 이것은 모바일 웹 개발자들을위한 반가운 소식입니다.

아래 표는 우리의 연구 결과를 보여줍니다 :

4메가바이트 우리가 테스트한 가장 큰 크기, 모든 IOS 장치 캐시 4메가바이트 구성 요소라고합니다. 이러한 장치에 대한 실제 캐시 제한 4메가바이트보다 클 수 있습니다. 그것이 이전 시험 문제가 좀 있었어요 반면 또한, 팜 예약 플러스에 웹 OS는 이런 시험에 일관성있는 결과를 주었다.

이런 시험에 CSS / JS 구성 요소에 대한보다 높은 한도가 디스크 캐시의 사용을 나타낼 수도 있지만 그것은 훨씬 낮은 한계 내 이전 테스트 IOS에서 HTML 구성 요소에 대한 보여준 가능성 것은, 이러한 구성 요소에 대한 RAM 캐시의 사용을 나타낼 수 있습니다 그러나 이것은 단지 추측입니다. 는 캐시 전력 사이클을 통과 이후 안드로이드, 적어도, 두 경우 모두에서 디스크 캐시를 사용하여 표시 않습니다.

새로운 추천

내 이전 테스트에서 결과와 결합,이 새로운 결과를 바탕으로, 다음과 같은 권장 사항의 집합 업데이 트를 제공합니다 :

• 먼 미래의 캐시 만료 헤더를 사용합니다. 이것은 조건부 GET 요청을 보낼 필요에서 브라우저를 방지할 수 있습니다.
• 이전 테스트가 IOS 3.2하여이 - 제한을 부과하는 것으로 나타났다 때문에, 25.6KB 또는 그들이 캐시되고 싶으면 미만으로 HTML 페이지를 제한하려고하면 테스트 장치의 가장 낮은 HTML 리소스 제한 iPad -되었다.
• 1메가바이트 아래의 CSS와 JS 구성 요소를 유지. 물론, 1메가바이트은 거대한이며 구성 요소는이보다 훨씬 작아해야하지만, 크기가 1MB를 접근하지 않는 cacheability을 위해서 별도의 요청으로 분할 구성 요소를 귀찮게하지 않습니다.
• 그것이 당신의 컴포넌트가 오랫동안 캐시에 계속, 또는 전원 사이클에 걸쳐 중요 경우 HTML5 응용 프로그램 캐시를 사용하는 것을 고려하십시오.
• 자신의 테스트를 마십시오. 내 이전 기사이의 중요성을 강조하고 여기서 다시 강조합니다. 출발점으로 이러한 결과를 사용하지만, 당신이 그들을 기반으로 중요한 결정을하기 전에 그들에게 자신을 확인합니다.

: 대화 찾기 bloglines | 테크노를

공유 및 확장 : del.icio.us로 스크랩 | 디그 그것! | 레딧!