javascript가 YIU 압축기 (자바 스크립트)로 압축되어 있는지 확인합니다.

Question

페이지 로딩 속도를 높이기 위해 로딩 자바 스크립트를 연기하도록 구성했습니다. 웹 사이트를 배포하기 위해 YIU 압축기를 사용하여 스크립트를 최소화하고 속도를 높이십시오. 두 가지 버전의 스크립트가있을 것입니다. 하나는 압축되고 원래 버전은 그렇지 않습니다. 예 : example-min.js 및 example.js. 일부 자바 스크립트는 기능이 제공 될 때만로드되며 때로는 더 많은 스크립트 (플러그인 아이디어)가 필요할 때로드됩니다.

어쨌든 'host'js 파일이 압축 된 경우 (다른 js 파일이 필요한 경우) 알고 싶습니다. 압축 될 때 js 파일의 축소 버전을로드합니다. 그렇지 않은 경우 (개발할 때) orginial 파일을로드합니다. 예를 들어

:

function myObject() 
{ 
var o = this; 

o.isJsMinified = function() 
{ s = o.isJsMinified.toString(),ss='s= '; 
    return (s.indexOf(ss+'o.is')<0); 
}; 

o.require = function(s, delay, baSync, fCallback) // add script to dom 
{ 
var oo = document.createElement('script'), 
oHead = document.getElementsByTagName('head')[0], 
f = (typeof fCallback == 'function')?fCallback:function(){}; 
if(!oHead) 
    { return false; } 
oo.onload = function() {oo.id='loaded'; f(oo); }; 
oo.type = 'text/javascript'; 
oo.async = (typeof baSync == 'boolean')?baSync:false; 
oo.src = s; 
setTimeout(function() { oHead.appendChild(oo); }, (typeof delay != 'number')?delay:1); 
return true; 
}; 

..... 
..... 

if(<new functionality found>) 
{ 
    if(o.isJsMinified()) 
    { o.require('new-min.js',800); } 
    else { o.require('new.js',800); } 
} 

..... 
..... 

} 

당신은 내가 함수 자체 (소스)가 공간 (축소 된 버전)에서 제거되었는지 감지 트릭을 사용하는 jsIsMinified() 함수를 봐주세요. 그러나 파이어 폭스에 문제가있다. 원본 형식을 반환하지 않아 차이점을 발견 할 수 없다. 예를 들어

: // YUI 압축기에 의해 압축 :

o.isJsMinified=function(){s=o.isJsMinified.toString(),ss='s= ';return (s.indexOf(ss+'o.is')<0);}; 

파이어 폭스가 표시됩니다

function() { 
    s = o.isJsMinified.toString(), ss = "s= "; 
    return s.indexOf(ss + "o.is") < 0; 
} 

기능은 파이어 폭스에 실패, 그것은 항상 '말한다'그것은 압축되지 않습니다. 아무도 이것에 대한 해결 방법을 알고 있습니까?

Answer 1

HTTP 헤더는 압축이 요청되었는지 여부를 지정하지만 there's no easy way to read them이므로 개발을위한 특별한 Firefox 확장이 필요할 수 있습니다.

변경을 수행하는 올바른 위치는 서버에 있으며, 특정 헤더가 제공되고 요청자 IP 주소가 로컬 인 경우 축소되지 않은 스크립트를 보내십시오.

Answer 2

나는 정말로 당신이 여기에있는 것을 복잡하게 만든다고 생각합니다. 와우, 서버에 두 개의 폴더 (js/production 및 js/debug)를 만들면 어떨까요? javascript 파일에는 생산적인지 또는 디버그인지를 나타내는 플래그가 하나있을 수 있습니다. 마찬가지로

if(window.DEBUG) { 
    o.require('/js/debug/new.js',800); 
} 
else { 
    o.require('/js/production/new.js',800); 
} 

생각해 보면, 그 폴더조차도 필요하지 않습니다. .min과 구별 할 수 있습니다. 코드에서 글로벌 변수 DEBUG을 설정하면됩니다.