jQuery 응용 프로그램을 개발 중이며 ajax를 통해 수행 된 각 요청은로드 된 내용에 대해 문서에서 새 div를 만듭니다. 한 번에 하나의 div 만 표시됩니다.돔이 느려지고 불안정 해지기 전에 얼마나 많은 div를 가질 수 있습니까?
앱이 반응이없고 느리게 시작하기 전에 몇 개의 div를 사용할 수 있습니까?
누구든지 이에 대한 아이디어가 있습니까?
편집 : 그것의 아이 패드 앱은 사파리에서 실행하고 특정 환경을 정의하지 않고 아주 기본적인 내용
정말로이 질문에 대한 절대적인 대답이 필요하다면 디자인을 재고하고 싶을 것입니다.
귀하의 응용 프로그램과 관련된 여러 요인에 따라 달라질 수 있습니다. 예 : 무거운 대 거의 CSS 사용, div의 크기, div 당 필요한 실제 그래픽 렌더링의 양, 대상 브라우저/플랫폼, DOM 이벤트 리스너 수 등.
당신이 할 수 있다고해서 ! :-)
미만 1,000 DIV 년대가 될 것입니다, 당신의 질문에 대답 할 수 없습니다.
그럼에도 불구하고 아무도 당신이 추측이라고 말하면됩니다. 서로 다른 브라우저와 하드웨어로 실제 구성을 테스트해야합니다. 또한 "너무 느린"것이 무엇인지를 결정할 수있는 성능 벤치 마크를 수립해야합니다.
화면에 한 번에 수만 개, 심지어 수십만 개의 div가 있습니다. 성능은 다음 중 하나에 따라 좋거나 나쁨 :
JavaScript에서 파싱되었거나 JavaScript에서 동적으로 생성 되었습니까?
HTML에서 파싱 된 것은 사용자가 큰 HTML 소스를 가지고 있으며 이로 인해 브라우저가 중단 될 수 있음을 의미합니다. JS에서 생성 된 것은 인터넷 익스플로러에서도 놀라 울 정도로 빠르다. JS는 모든 브라우저 중에서 가장 느리다.
흥미 롭다 ... 그건 의미가 있지만, 내 경험으로는, 아무것도 브라우저를 자바 스크립트처럼 얼려서는 안된다. 그래서 도전 과제는 세대 스크립을 해체하고 그 사이의 UI에 양보하도록하는 것입니다. – harpo
실제로 파싱 된 JS는 빠른 속도로 빠릅니다! –
다른 사람들이 말했듯이 실제로는 대답이 없습니다.
그러나, Google지도 API 버전 3에 대한이 이야기에서 화자는 브라우저 불행의 기본 기준으로 숫자 ten thousand을 여러 번 가져옵니다.
명명되지 않은 Dao // 에서 천국과 지구가 나왔다 // 명명 된 이름은 // 수만 명의 생물의 어머니. –
나는 문제없이 수천 된 div를 추가 할 수있었습니다. 나중에 클라이언트 컴퓨터에서 수행 할 작업과 메모리에 따라 다릅니다. 다른 모든 사람들은 그것에 대해 옳습니다.
Harpo가 말했듯이 10K는 아마도 좋은 천장 일 것입니다. 한 번에 약 4K div에서 시작하는 속도 문제를 발견했지만 하드웨어는 그 이후로 향상되었습니다.
Neil N이 말했듯이 스크립팅을 통해 div를 추가하는 것은 거대한 HTML 소스를 갖는 것보다 낫습니다.
Harpo의 의견에 답하기 위해 JS가 페이지를 잠그지 않고 "페이지가 느리게 실행 중"이라는 오류를 발생시키지 않도록 "해체하는"방법 중 하나는 각 "끝 부분에 타이머를 호출하는 것입니다. div "루틴을 호출하고 타이머는 다시"div 추가 "함수를 다시 호출합니다.
이제 내 질문은 : 수천 개의 div를 추가 할 필요가 없도록 "페인트"할 수 있습니까? 일부 브라우저에서는 캔버스 태그를 사용하여이 작업을 수행 할 수 있지만 IE에서는 VML (excanvas 프로젝트)을 사용하는 것이 가능하지 않다고 생각합니다. 아니면 그렇지? VML은 DOM에 새로운 요소를 추가하여 "페인트"한다고 생각합니다. 단순한 모양이 아니라면 DIV를 사용할 수 있습니다.
스크립팅을 통해 이미지 원본을 변경할 수 있습니까? (DOM의 이미지, 당연히 서버의 원래 이미지가 아닙니다.)
테스트. 그럼 알게 될거야. –