Extjs 가속화(자바스크립트 가속)_extjs

EXT의 모든 js는 상대적으로 큽니다. 하나의 ext-all-debug.js는 2MB가 넘고 압축 버전(js에서 줄 바꿈 및 공백 제거)도 600K가 넘으므로 사용하지 않는 사람들에게 적합합니다. 매우 빠른 네트워크. 때가 되면 js를 다운로드하는 데 오랜 시간을 기다려야 합니다. 그 중 Calendar task 컨트롤은 4~5개의 js가 있고, 각 js의 크기는 70K가 넘습니다. 비록 post-loading 방식을 채택하고 있지만, 사용자가 My Task 기능을 클릭해야만 js가 다운로드됩니다. 그러나 이것은 여전히 ​​매우 복잡합니다. 다운로드한 js가 매우 느리기 때문에
이러한 점을 고려할 때 인터넷에서 Joffice와 같은 프로그램을 사용하는 속도는 많은 개발자가 개발 기술로 ext를 선택하는 것을 두려워하게 만듭니다.

다음 방법을 통해 애플리케이션의 실행 속도를 향상시킬 수 있습니다.
1. 초기 단계에서는 js를 최대한 적게 로드합니다.
Joffice에서는 ScriptMgr.load를 사용하는 것이 더 좋습니다. 로드가 완료되면 현재 페이지가 새로 고쳐지지 않는 한 다음에 이 함수에 액세스할 때 js를 로드할 필요가 없습니다.

코드 복사 코드는 다음과 같습니다.

function $ImportJs(viewName,callback) {
var b = document.getElementById(viewName '- hiden');
if (b != null) {
var view = eval('new ' viewName '()')
callback.call( this, view);
} else {
var jsArr = eval('App.importJs.' viewName)
if(jsArr==undefine){
var view = eval('new ' viewName '()');
callback.call(this, view);
return ;
}
ScriptMgr.load({
scripts : jsArr,
callback( ) {
Ext.DomHelper.append (document.body,"

") ;
var view = eval(' ​​new ' viewName '()');
callback.call(this, view)
}


2. js에 Gzip 사용 매우 강력한 압축

Gzip 공식 웹사이트는 다음과 같습니다.
http://www.gnu.org/software/gzip/
Gzip은 사용이 매우 간단합니다
디렉토리에 압축을 풀면 There is a Gzip.exe 파일이 표시됩니다. 그런 다음 명령 창에 해당 디렉터리를 입력하고
gzip ext-all.js
ext-all.js를 실행하면 즉시 ext-가 됩니다. all.js.gz
원본에서 크기가 변경됩니다. 600k 이상이 갑자기 160k 이상으로 바뀌어 훨씬 작아졌습니다. 이번에는 다운로드 속도가 매우 빠릅니다.
그럼 브라우저는 이런 압축파일도 파싱할 수 있나요? 대답은 '예'입니다. 전제는 이러한 종류의 파일을 압축 해제한 다음 브라우저에서 실행해야 함을 브라우저에 알리는 것입니다.
그러면 애플리케이션은 파일의 압축을 풀어야 함을 브라우저에 어떻게 알릴까요? 이 작업은 서버에서 Http Header 명령을 통해 수행해야 합니다.
JOffice에서는 Filter를 통해서 이루어집니다.
1. ext.all.js.gz 파일의 이름을 ext.all.gzjs로 변경합니다. 필터는 잠시 후 이 파일에 대한 액세스를 차단합니다.
2. 필터를 작성하고 헤더에 명령어를 추가하세요
코드는 다음과 같습니다.

코드를 복사하세요 코드는 다음과 같습니다.

package com.htsoft.core.web.filter

import java.io.IOException
import java.util.HashMap; java.util.Iterator;
가져오기 javax.servlet.Filter;
가져오기 javax.servlet.FilterConfig; javax.servlet.ServletException;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletResponse;
공용 클래스 GzipJsFilter는 Filter {
Map headers = new HashMap();
public void destroy() {
}
public void doFilter(ServletRequest req, ServletResponse res,
FilterChain을 구현합니다. chain) throws IOException, ServletException {
if(req instanceof HttpServletRequest) {
doFilter((HttpServletRequest)req, (HttpServletResponse)res, chain)
}else {
chain.doFilter(req, res);
}
}
public void doFilter(HttpServletRequest 요청,
HttpServletResponse 응답, FilterChain 체인)
throws IOException, ServletException {
request.setCharacterEncoding("UTF-8" );
for( Iterator it = headers.entrySet().iterator();it.hasNext();) {
Map.Entry 항목 = (Map.Entry)it.next(); response.addHeader((String) Entry.getKey(),(String)entry.getValue())
}
chain.doFilter(요청, 응답)
}
public void init( FilterConfig config)는 ServletException {
String headersStr = config.getInitParameter("headers");
String[] headers = headersStr.split(","); for(int i = 0; i < ; headers.length; i ) {
String[] temp = headers[i].split("=")
this.headers.put(temp[0].trim(), temp[1] .trim());
}
}
}


3. WEB.xml 파일에 다음 구성을 추가합니다.




코드 복사


코드는 다음과 같습니다.

GzipJsFilter
com.htsoft.core.web.filter.GzipJsFilter

headers
Content-Encoding=gzip

GzipJsFilter
* .gzjs



4. 압축된 파일을 index.jsp에 추가합니다.

브라우저가 압축을 푼 후에도 코드가 동일한 것을 볼 수 있습니다.

위에서 볼 수 있듯이 이 부분은 외부 네트워크에서 사용되는데, 속도가 비교적 빠릅니다. 물론 브라우저가 이 파일의 압축을 풀려면 시간이 좀 걸리겠지만, 로컬에서 압축을 풀면 속도가 매우 빠르기 때문에 그냥 놔두셔도 됩니다.

속도 문제를 완전히 해결할 수는 없지만 여전히 도움이 될 수 있습니다.