2014-09-12 5 views
0

Javascipt에서 매우 큰 JSON 배열을 구문 분석해야합니다. 그것은 다음과 같습니다 내 구문 분석 기능 parseJSON()이 전체 개체를 전달할 경우자바 스크립트에서 큰 JSON 배열 구문 분석

mydata = [ 
    {'a':5, 'b':7, ... }, 
    {'a':2, 'b':3, ... }, 
    . 
    . 
    . 
    ] 

이제 일이, 다음의 과정 작동하지만, 그것에게의 경우 30 ~ 40 초 동안 차단 탭의 프로세스를 (배열 160000 개체).

서버에서이 JSON을 요청하고 구문 분석하는 전체 과정 중에 사용자에게 '로드 중'gif를 표시하고 있습니다. 물론 구문 분석 함수를 호출 한 후에도 gif가 고정되어 사용자 경험이 나빠질 수 있습니다. 나는이 시간을 돌아볼 수있는 방법이 없다고 생각합니다. 어쨌든 (적어도) 적재 gif가 얼어 붙지 않게하는 방법이 있습니까?

몇 밀리 초마다 JSON의 청크에서 parseJSON()을 호출하는 것과 비슷한 점이 있습니까? 나는 자바 스크립트에서 멍청한 놈이긴하지만 그것을 구현할 수 없다.

정말 고마워, 네가 여기서 나를 도울 수 있다면 정말 고마워.

+3

160 000 개의 개체가 실제로 많이 있습니다. 서버 쪽에서 분할해야합니다 – Pinoniq

+0

이 스레드를 확인 했습니까? http://stackoverflow.com/questions/1160137/execute-background-task-in-javascript –

+0

페이지 번호 매기기를 서버 측에 적용하고 json에서 페이지 번호와 다음 페이지 등을 추가 한 다음 api를 계속 호출하여 아약스 성공을 유도합니다. –

답변

1

this link을 확인하는 것이 좋습니다. 다중 스레드에 관한 것입니다. 기본적으로

: 이동성에 대한

var url = 'http://bigcontentprovider.com/hugejsonfile'; 

var f = '(function() { 
      send = function(e) { 
       postMessage(e); 
       self.close(); 
      }; 
      importScripts("' + url + '?format=json&callback=send"); 
     })();'; 

var _blob = new Blob([f], { type: 'text/javascript' }); 

_worker = new Worker(window.URL.createObjectURL(_blob)); 
_worker.onmessage = function(e) { 
    //Do what you want with your JSON 
} 
_worker.postMessage(); 

자신을 정직하게 그것을 시도하지 않은 ...

편집 : 세바스티앙 D.은 a link to mdn에 코멘트를 기록했다. 방금 호환성 섹션 id에 대한 참조를 추가했습니다.

+0

이것은 정말 좋은 제안이지만, 조금 더 확장하고 이식성에 대한 경고를 추가 할 수 있습니까? – nepeo

+0

너무 많이 확장 할 수있을만큼 주제가 충분하지 않습니다. 그러나 나는 브라우저 호환성을 가진 링크를 재 게시했다. –

+0

솔직히 말해서, 내가 게시하기 전까지는이 기능에 대해 들어 보지 못했습니다! 그것은 꽤 흥미 진진한 API입니다. 대부분 모바일 기기에서 작동한다는 것을 감안할 때 안드로이드 지원의 부족은 우울합니다. 시도하기 전에 잠시 기다려야 할 것 같습니다. – nepeo

1

전체 페이지 잠금이 30-40 초 만난 적이 한번도 없었습니다. 거의 감동했습니다. 데이터를 훨씬 작게 만들거나 서버 측의 여러 파일로 분할하는 것이 진정한 해답입니다. 데이터의 모든 작은 바이트가 실제로 필요합니까?

또는 파일을 변경할 수없는 경우 @ Cyrill_DD의 작업자 스레드 응답은 데이터를 구문 분석하여 기본 JS로 보낼 수 있습니다. 이것은 당신이 생각할 수있는 완벽한 수정이 아닙니다. 두 스레드간에 데이터를 전달하려면 정보를 직렬화하고 다시 해석해야하므로 모든 데이터를 한 번에 전달하려고 시도하면 스레드간에 데이터가 전달 될 때 속도가 크게 느려지고 다시 제곱으로 돌아갈 수 있습니다. 작업자 스레드에 쿼리 시스템을 구축하여 필요할 때 데이터 청크를 요청하고 메시지 콜백을 사용하면 주 스레드에서 구문 분석 속도가 느려지고 주 컨텍스트에 데이터를 모두로드하지 않고 데이터에 액세스 할 수 있습니다.

나는 작업자 스레드가 비교적 새롭고 메인 브라우저 지원은 좋지만 모바일은 끔찍하다는 것을 추가해야한다.