Coolite Resource file not been compressed

Page 1 of 2 12 LastLast
  1. #1

    Coolite Resource file not been compressed



    Hi Coolite team,

    Long time we hanven't chat. Nice work with version 0.7. I'll be migrating soon, but for the moment my question is still regarding deployment and version 0.6.

    I roamed through the forum and found many topics about this subject, but I am still not sure... It may be just my confusion.

    Checking the version with Firebug and other plug-ins like (YSlow) I can see that the ext js is been rendered compressed, or better minified. This way...

    //////////////////////////////////////////////////////////////////////////////// // http://.../WebResource.axd?d=2l8PQ_g...83424172187500 ////////////////////////////////////////////////////////////////////////////////
    /*
     * Ext JS Library 2.2
     * Copyright(c) 2006-2008, Ext JS, LLC.
     * licensing@extjs.com
     * 
     * http://extjs.com/license
     */
    
    
    Ext={version:"2.2"};window["undefined"]=window["undefined"];Ext.apply=function(C,D,B){if(B){Ext.apply(C,B)}if(C&&D&&typeof D=="object"){for(var A in D){C[A]=D[A]}}return C};(function(){var idSeed=0;var ua=navigator.userAgent.toLowerCase();var isStrict=document.compatMode=="CSS1Compat",isOpera=ua.indexOf("opera")>-1,isSafari=(/webkit|khtml/).test(ua),isSafari3=isSafari&&ua.indexOf("webkit/5")!=-1,isIE=!isOpera&&ua.indexOf("msie")>-1,isIE7=!isOpera&&ua.indexOf("msie 7")>-1,isGecko=!isSafari&&ua.indexOf("gecko")>-1,isGecko3=!isSafari&&ua.indexOf("rv:1.9")>-1,isBorderBox=isIE&&!isStrict,isWindows=(ua.indexOf("windows")!=-1||ua.indexOf("win32")!=-1),isMac=(ua.indexOf("macintosh")!=-1||ua.indexOf("mac os x")!=-1),isAir=(ua.index
    
    ...
    Just bellow, I can see a Javascript like this (please note I am not using version 0.7 despite it setting it to 0.7):

    //////////////////////////////////////////////////////////////////////////////// // http://.../WebResource.axd?d=2l8PQ_g...83424172187500 ////////////////////////////////////////////////////////////////////////////////
    /********
    * @version: 0.6.0 - Professional Edition (Coolite Commercial License)
    * @author: Coolite Inc. http://www.ext.net/
    * @date: 2008-08-05
    * @copyright: Copyright (c) 2006-2008, Coolite Inc. (http://www.ext.net/). All rights reserved.
    * @license: See license.txt and http://www.ext.net/license/. 
    * @website: http://www.ext.net/
    ********/
    
    
    if (!Ext.$) { Ext.$ = Ext.get; }
    
    
    Ext.namespace("Coolite.Ext");
    
    
    Coolite.Ext.Version = "0.7.0";
    
    
    Coolite.Ext.FormViewport = Ext.extend(Ext.Container, {
        initComponent: function() {
            Coolite.Ext.FormViewport.superclass.initComponent.call(this);
            var html = document.getElementsByTagName("html")[0];
            html.className += " x-viewport";
            html.style.height = "100%";
            this.el = Ext.$(document.forms[0]);
            this.el.setHeight = this.el.setWidth = this.el.setSize = Ext.emptyFn;
            this.el.dom.scroll = "no";
            this.allowDomMove = false;
            this.autoWidth = this.autoHeight = true;
            Ext.EventManager.onWindowResize(this.fireResize, this);
            this.renderTo = this.el;
            Ext.getBody().applyStyles({
                overflow: "hidden",
                margin: "0",
                padding: "0",
                border: "0px none",
                height: "100%"
            });
            this.el.applyStyles({ height: "100%", width: "100%" });
        },
    
    
        fireResize: function(w, h) {
            this.fireEvent("resize", this, w, h, w, h);
        }
    });
    
    ...
    As you can see the first is minified and the secound which I assume is coming from coolite.axd is not. It is embedded and I checked all my web.config settings before ask this question. I am aware about IIS6 and IIS7 differences and the properties to render gzip, etc...

    my web.config:

    <coolite cleanResourceUrl="false" gzip="true" scriptAdapter="Ext" renderScripts="Embedded"
        renderStyles="Embedded" scriptMode="Release" theme="Gray" />
    
    ...
    
    <add path="*/coolite.axd" verb="*" type="Coolite.Ext.Web.ResourceManager" validate="false" />
    It may be that it is been gziped and just not minified and it is my misunderstanding, but I just want to make sure that is not possible to decrease the size and improve performance as I am facing some serious performance issues (not coolite fault).

    Also, it may be that it is just the way how Firebug (Yslow) is showing me the Javascript and I am doing anything wrong.

    How can I make sure if it is really compressed?
    Is there a way to minified the coolite javascript as it is for ExtJs?

    Most important referecences I read:

    http://www.ext.net/download/README.txt
    http://forums.ext.net/showthread.php?postid=5479.aspx (and all links)


    Thanks.
  2. #2

    RE: Coolite Resource file not been compressed

    Someone correct me if I'm wrong, but I don't believe the Coolite framework will compress your JavaScript when the scriptMode parameter is set to Debug even when the gzip parameter is set to true. I think the rationale behind this, is that the output won't be very debugger friendly if it's not readable.

    <coolite cleanResourceUrl="false" gzip="true" scriptAdapter="Ext" renderScripts="Embedded" renderStyles="Embedded" scriptMode="Debug" theme="Gray" />

    -MC
  3. #3

    RE: Coolite Resource file not been compressed

    Hi MC,

    Thanks for your answer, sorry I pasted the wrong web.config; this one I have in my computer, not in production. Yes, it is in Release, indeed!

    Also, minified and compressed (gzip) are different things. Please correct me if I am wrong, I don't know too much about this subject.

    What I am not sure is if Coolite will ever be minified changing any property?

    As I said, it may be that is been compressing, I just not sure. Obviously without any tool I wouldn't see the Javascript (lets say right-clicking on page) as it is embedded on the resorce file.

    Any thought to understand this matter will be very appreciated.

    Leonardo.
  4. #4

    RE: Coolite Resource file not been compressed

    I believe you are correct. I don't think the Coolite Toolkit minifies the embedded JavaScript; I believe it just GZips it based on the browser's capabilities. If you have custom javascript, you would have to minify it for your release build prior to compiling and ultimately embedding it as a resource.

    It would be really cool to have a Property on embedded WebResources to automagically minify embedded resources such as javascript and css. If anyone's accomplished this, please share =).

    -MC
  5. #5

    RE: Coolite Resource file not been compressed

    I'm dreaming, but here is a link to a port of the popular Yahoo! YUI Compressor from Java to C#. This library minifies both JavaScript and CSS. This licensing probably restricts the Coolite team from integrating it into their project, but it would be a great open source extension.

    http://www.codeplex.com/YUICompressor


    Also, check out the Web Developer extension for FireFox. I believe the page response header will tell you if Gzip compression has been applied to the page. (under Information > View Response Headers)


    -MC
  6. #6

    RE: Coolite Resource file not been compressed

    At the moment, the coolite-core.js and coolite-data.js files are not minified, but they are sent (by default) gzipped to the browser.

    Minifying the two files is on our list of things to add to the build process.*


    That said, minifying (+gzip) the files will only save a couple kb each over their current "over-the-wire" size. Every little bit helps, although the difference will be effectively*negligible.*


    Geoffrey McGill
    Founder
  7. #7

    RE: Coolite Resource file not been compressed

    I am currently using YUICompressor, and it helped alot. *I have tons of custom controls with their own js files, and YUICompressor consolidated 15 requests into 1 request. *However, I doubt minifying Coolite will get you any performance gains. *If browser caching is enabled, those javascript files will only need to be downloaded once. *

    Here are some things I did to optimize performance:
    1. *Disable viewstate
    2. *Set IDMode (new in v0.7) to output shorter server ids instead of wacky mangled client ids
    3. *Set Type=Load for AjaxEvents that do not need postdata. *By default, it's on so you are sending post data and viewstate on every AjaxEvent.
    4. *Use ASP.NET AJAXManager's CompositeScript feature to consolidate other 3rd party tools' javascript files. *This is similar to YUICompressor except it is done on the fly.


    Some helpful links:
    http://developer.yahoo.com/performance/rules.html

    http://msdn.microsoft.com/en-us/library/cc668225.aspx

  8. #8

    RE: Coolite Resource file not been compressed



    Thanks MC and Geoffrey.McGill

    MC, I never used the Dev. Extension before, but Firebug also gives me the header information.
    However the gzip may be applied to some scripts and others not. Right?
    I can't say it is been compressed by looking on Firebug's scripts tab pointing to the right resource file, because I beleave there always will show me the scripts Un-Gziped.

    Where is the right place to check this information?

    Geoff, that answer my questions! Just don't know where to double check it's been gzipped.

    Thanks for the concern about performance and delivering a high standard code.

    Leonardo.
  9. #9

    RE: Coolite Resource file not been compressed

    For everyone following along, here is how you can verify that Gzip is working.

    Let's say your page was https://examples1.ext.net/#/Miscella...ider/Overview/

    When you view the page's html source, you will see in the header the links to all of you external resources (i.e. JS and CSS).

    <link rel="stylesheet" type="text/css" href="/extjs/resources/css/ext-all-embedded-css/coolite.axd?635" />
     <style type="text/css">
     .icon-application{background-image:url(/icons/application-png/ext.axd) !important;}
     </style>
    <title>
     Coolite Toolkit Examples - ExtJS ASP.NET Web Controls with AJAX
    </title><link rel="stylesheet" type="text/css" href="resources/css/main.css" />
    For each resource you want to test, you can take the href parameter, determine the absolute URL,
    put this into the address bar, and do a Information > View Response Header with the FireFox Web Developer tool.

    Date: Tue, 27 Jan 2009 18:24:57 GMT
    Server: Microsoft-IIS/6.0
    X-Powered-By: ASP.NET
    X-AspNet-Version: 2.0.50727
    Cache-Control: public, max-age=31536000
    Expires: Wed, 27 Jan 2010 18:24:57 GMT
    Last-Modified: Sun, 01 Jun 2008 07:00:00 GMT
    Content-Type: text/css
    Content-Length: 15649
    Content-Encoding: gzip
    Age: 0
    
    200 OK
    And as you can see, the Content-Encoding is gzipped.
    To see the size difference, you can disable the gzip and compare the Content-Length results.

    -MC
    Last edited by geoffrey.mcgill; Feb 22, 2011 at 3:22 AM.
  10. #10

    RE: Coolite Resource file not been compressed

    mindcore1, you can also get fiddler2 which will tell you everything you will need to know about each request. It is also a great debugging tool for Ajax.
Page 1 of 2 12 LastLast

Similar Threads

  1. [CLOSED] resource manager and limiting extjs file size
    By craig2005 in forum 1.x Legacy Premium Help
    Replies: 9
    Last Post: Oct 03, 2013, 9:41 AM
  2. [CLOSED] Bug in French Resource file
    By r_honey in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Feb 15, 2011, 8:01 PM
  3. Could not load file or assembly Coolite.Ext.Web
    By ranganath in forum 1.x Help
    Replies: 0
    Last Post: May 04, 2010, 9:11 AM
  4. Replies: 0
    Last Post: Mar 20, 2010, 9:05 AM
  5. Adding The Resource File To Form
    By Dinesh.T in forum 1.x Help
    Replies: 0
    Last Post: Dec 11, 2009, 2:13 AM

Posting Permissions