<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>JSToolbox - все о JavaScript &#187; Оптимизация</title>
	<atom:link href="http://www.jstoolbox.com/category/optimizaciya/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.jstoolbox.com</link>
	<description>Блог о программировании вообще и о JavaScript в частности, уроки, статьи, заметки, база знаний.</description>
	<lastBuildDate>Wed, 28 Jul 2010 22:33:40 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Сжатие JavaScript/CSS файлов при помощи Phing</title>
		<link>http://www.jstoolbox.com/2009/10/18/szhatie-js-css-fajlo-pri-pomoshhi-phing/</link>
		<comments>http://www.jstoolbox.com/2009/10/18/szhatie-js-css-fajlo-pri-pomoshhi-phing/#comments</comments>
		<pubDate>Sun, 18 Oct 2009 15:38:42 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Phing]]></category>
		<category><![CDATA[Оптимизация]]></category>

		<guid isPermaLink="false">http://www.jstoolbox.com/?p=508</guid>
		<description><![CDATA[<p>В последнее время я имел возможность поработать с <a href="http://phing.info" title="Phing">Phing</a> - программой для сборки приложений. С её помощью можно копировать файлы приложения, заменять в них текст (например параметры конфигурационных файлов), и многое другое. Помимо прочего, можно самому создать подключаемые плагины, которые будут выполнять нужные нам задания. Мне нужно было при копировании таблиц стилей и скриптов выполнять их сжатие при помощи <a href="developer.yahoo.com/yui/compressor/" title="YUI compressor">YUI компрессора</a>, и я нашел отличное <a href="http://www.thepopeisdead.com/main/comments/easy_javascript_css_compression_with_phing/">решение</a> для этого.</p>]]></description>
			<content:encoded><![CDATA[<p>В последнее время я имел возможность поработать с <a href="http://phing.info" title="Phing">Phing</a> &#8211; программой для сборки приложений. С её помощью можно копировать файлы приложения, заменять в них текст (например параметры конфигурационных файлов), и многое другое. Помимо прочего, можно самому создать подключаемые плагины, которые будут выполнять нужные нам задания. Мне нужно было при копировании таблиц стилей и скриптов выполнять их сжатие при помощи <a href="http://developer.yahoo.com/yui/compressor/" title="YUI compressor">YUI компрессора</a>, и я нашел отличное <a href="http://www.thepopeisdead.com/main/comments/easy_javascript_css_compression_with_phing/">решение</a> для этого.</p>
<p><span id="more-508"></span></p>
<p>Представленный ниже плагин перед копированием сжимает скрипты и стили. Но учтите, что YUI-Compressor требует, чтобы была установлена Java:</p>
<pre class="prettyprint">
&lt;?php
/**
 * Uses the Phing Task
 */
require_once 'phing/Task.php';

/**
 * Task to compress files using YUI Compressor.
 *
 * @author      Keith Pope
 */
class kpMinTask extends Task
{
    /**
     * path to YuiCompressor
     *
     * @var  string
     */
    protected $yuiPath;

    /**
     * the source files
     *
     * @var  FileSet
     */
    protected $filesets    = array();

    /**
     * Whether the build should fail, if
     * errors occured
     *
     * @var boolean
     */
    protected $failonerror = false;

    /**
     * directory to put minified javascript files into
     *
     * @var  string
     */
    protected $targetDir;

    /**
     * sets the path where JSmin can be found
     *
     * @param  string  $yuiPath
     */
    public function setYuiPath( $yuiPath )
    {
        $this->yuiPath = $yuiPath;
    }

    /**
     *  Nested creator, adds a set of files (nested fileset attribute).
     */
    public function createFileSet()
    {
        $num = array_push( $this->filesets, new FileSet() );
        return $this->filesets[$num - 1];
    }

    /**
     * Whether the build should fail, if an error occured.
     *
     * @param boolean $value
     */
    public function setFailonerror( $value )
    {
        $this->failonerror = $value;
    }

    /**
     * sets the directory compressor traget dir
     *
     * @param  string  $targetDir
     */
    public function setTargetDir( $targetDir )
    {
        $this->targetDir = $targetDir;
    }

    /**
     * The init method: Do init steps.
     */
    public function init()
    {
        return true;
    }

    /**
     * The main entry point method.
     */
    public function main()
    {
        $command = 'java -jar {yuipath} {src} -o {target}';

        foreach( $this->filesets as $fs )
        {
            try
            {
                $files    = $fs->getDirectoryScanner( $this->project )->getIncludedFiles();
                $fullPath = realpath( $fs->getDir( $this->project ) );

                foreach( $files as $file )
                {
                    $this->log( 'Minifying file ' . $file );

                    $target = $this->targetDir . '/' . str_replace( $fullPath, '', $file );

                    if( file_exists( dirname( $target ) ) == false )
                    {
                        mkdir( dirname( $target ), 0700, true );
                    }

                    $cmd = str_replace( '{src}', $fullPath . DIRECTORY_SEPARATOR . $file, $command );
                    $cmd = str_replace( '{target}', realpath( $target ), $cmd );
                    $cmd = str_replace( '{yuipath}', realpath( $this->yuiPath ), $cmd );

                    $output = array();
                    $return = null;

                    exec( $cmd, $output, $return );

                    foreach( $output as $line )
                    {
                        $this->log( $line, Project::MSG_VERBOSE );
                    }

                    if( $return != 0 )
                    {
                      throw new BuildException( "Task exited with code $return" );
                    }

                }
            } 

            catch( BuildException $be )
            {
                // directory doesn't exist or is not readable
                if ($this->failonerror)
                {
                    throw $be;
                }
                else
                {
                    $this->log($be->getMessage(), $this->quiet ? Project::MSG_VERBOSE : Project::MSG_WARN);
                }
            }
        }
    }
}
</pre>
<p>Сохраните этот файл в папке <strong>build/extended/tasks/kpMinTask.php</strong>, а <em>yuicompressor</em> в <strong>build/tools/yuicompressor.jar</strong>. Здесь, <strong>build</strong> &#8211; это папка, в которой находится XML файл сборки.</p>
<p>Далее, в файле сборки <em>build.xml</em> добавляем задачи для сжатия:</p>
<pre class="prettyprint">
&lt;taskdef name="minify" classname="extended.tasks.kpMinTask" /&gt;

&lt;target name="minify-js"&gt;
    &lt;echo&gt;--------------------------------&lt;/echo&gt;
    &lt;echo&gt;| Minify javascript to release |&lt;/echo&gt;
    &lt;echo&gt;--------------------------------&lt;/echo&gt;
    &lt;minify targetDir="${DEPLOY_DIR}/public/js/"
              yuiPath="tools/yuicompressor.jar"&gt;
        &lt;fileset dir="${TRUNK_PATH}/public/"&gt;
                &lt;include name="js/*.js" /&gt;
                &lt;include name="js/**/*.js" /&gt;
        &lt;/fileset&gt;
    &lt;/minify&gt;
&lt;/target&gt;

&lt;target name="minify-css"&gt;
    &lt;echo&gt;--------------------------------&lt;/echo&gt;
    &lt;echo&gt;| Minify CSS to release |&lt;/echo&gt;
    &lt;echo&gt;--------------------------------&lt;/echo&gt;
    &lt;minify targetDir="${DEPLOY_DIR}/public/"
              yuiPath="tools/yuicompressor.jar"&gt;
        &lt;fileset dir="${TRUNK_PATH}/public/css/"&gt;
                &lt;include name="css/**/*.css" /&gt;
                &lt;include name="css/*.css" /&gt;
        &lt;/fileset&gt;
    &lt;/minify&gt;
&lt;/target&gt;
</pre>
<p>Теперь, для выполнения сжатия/копирования файлов нужно запустить задачу <em>minify-js</em> или <em>minify-css</em> или включить их в другую задачу.</p>
<p>Если у вас нет возможности использовать YUI-Compressor (например нет java на хостинге), то можете воспользоваться другими скриптами: <a href="http://code.google.com/p/jsmin-php/" title="JSMin">JSMin</a> и <a href="http://code.google.com/p/cssmin/">CSSMin</a>. Подробнее о том, как их использовать вместе с Phing читайте <a href="http://www.simplecoding.org/ispolzovanie-phing-dlya-sborki-web-prilozhenij.html" title="Использование Phing для сборки web приложений">здесь</a>.</p>
<div class="postLinks"><strong>При поддержке:</strong><br/><br />
stihi2.ru  &#8211; <a href=http://stihi2.ru/>стихи эпиграммы</a>,<br />
losty.ru  &#8211; <a href=http://losty.ru/razdel/novyigod.php>стихи про новый год</a>,<br />
full-house.ru  &#8211; <a href=http://full-house.ru/>стихи хокку</a></div>
]]></content:encoded>
			<wfw:commentRss>http://www.jstoolbox.com/2009/10/18/szhatie-js-css-fajlo-pri-pomoshhi-phing/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Эффективное сжатие изображений</title>
		<link>http://www.jstoolbox.com/2008/08/13/effektivnoe-szhatie-izobrazhenij/</link>
		<comments>http://www.jstoolbox.com/2008/08/13/effektivnoe-szhatie-izobrazhenij/#comments</comments>
		<pubDate>Wed, 13 Aug 2008 17:36:24 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Оптимизация]]></category>
		<category><![CDATA[jpeg]]></category>
		<category><![CDATA[png]]></category>
		<category><![CDATA[изображения]]></category>

		<guid isPermaLink="false">http://www.jstoolbox.com/2008/08/13/effektivnoe-szhatie-izobrazhenij/</guid>
		<description><![CDATA[В веб дизайне размер изображений чрезвычайно важен. Я раньше полагал, что нет ничего лучшего в плане сжатия изображений, как Photoshop и его &#34;Сохранить для веб&#8230;&#34;. Но как оказывается, есть нечто лучше &#8211; это пара утилит, работающих из командной строки и способных сжимать файлы png и jpg &#8211; pngcrush и jpegtran.
Чтобы сжать png файлы без потери [...]]]></description>
			<content:encoded><![CDATA[<p>В веб дизайне размер изображений чрезвычайно важен. Я раньше полагал, что нет ничего лучшего в плане сжатия изображений, как Photoshop и его &quot;Сохранить для веб&#8230;&quot;. Но как оказывается, есть нечто лучше &#8211; это пара утилит, работающих из командной строки и способных сжимать файлы png и jpg &#8211; <a href="http://pmt.sourceforge.net/pngcrush/">pngcrush</a> и <a href="http://sylvana.net/jpegcrop/jpegtran/">jpegtran</a>.</p>
<p>Чтобы сжать png файлы без потери качества используйте следующее:</p>
<pre class="prettyprint">
pngcrush -rem alla -reduce -brute image.png result.png
</pre>
<p>Чтобы сжать файлы jpeg, используйте jpegtran:</p>
<pre class="prettyprint">
jpegtran -copy none -optimize -perfect src.jpg dest.jpg
</pre>
<p>По моим оценкам, при использовании этих утилит можно дополнительно сжать изображения на 2 &#8211; 7%. Максимум, который я получал, это 22%, но это только для небольших файлов, размером 1- 2Кб.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jstoolbox.com/2008/08/13/effektivnoe-szhatie-izobrazhenij/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>PHP Speedy обновился до 0.4.7</title>
		<link>http://www.jstoolbox.com/2008/07/15/php-speedy-obnovilsya-do-047/</link>
		<comments>http://www.jstoolbox.com/2008/07/15/php-speedy-obnovilsya-do-047/#comments</comments>
		<pubDate>Tue, 15 Jul 2008 20:58:20 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Новости]]></category>
		<category><![CDATA[Оптимизация]]></category>

		<guid isPermaLink="false">http://www.jstoolbox.com/2008/07/15/php-speedy-obnovilsya-do-047/</guid>
		<description><![CDATA[Теперь этот замечательный плагин может работать с Wordpress 2.6. PHP Speedy &#8211; это PHP скрипт, который позволяет объединять несколько JavaScript (CSS) файлов в один, сжимать их при помощи GZip. Это позволяет значительно ускорить скорость загрузки сайта. Скрипт можно инсталлировать на любой сайт, работающий на PHP, а для wordpress также имеется плагин. Более подробнее об этом [...]]]></description>
			<content:encoded><![CDATA[<p>Теперь этот замечательный плагин может работать с Wordpress 2.6. <a href="http://aciddrop.com/php-speedy/">PHP Speedy</a> &#8211; это PHP скрипт, который позволяет объединять несколько JavaScript (CSS) файлов в один, сжимать их при помощи GZip. Это позволяет значительно ускорить скорость загрузки сайта. Скрипт можно инсталлировать на любой сайт, работающий на PHP, а для wordpress также имеется плагин. Более подробнее об этом скрипте я писал <a href="http://www.jstoolbox.com/2008/03/13/uskorenie-skorosti-zagruzki-stranic/">здесь</a>.</p>
<p><a href="http://aciddrop.com/2008/07/15/php-speedy-wp-version-047-works-with-wp26/" class="download">скачать</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jstoolbox.com/2008/07/15/php-speedy-obnovilsya-do-047/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Анализ производительности для jQuery</title>
		<link>http://www.jstoolbox.com/2008/06/16/analiz-proizvoditelnosti-dlya-jquery/</link>
		<comments>http://www.jstoolbox.com/2008/06/16/analiz-proizvoditelnosti-dlya-jquery/#comments</comments>
		<pubDate>Mon, 16 Jun 2008 15:49:34 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Оптимизация]]></category>
		<category><![CDATA[Плагины]]></category>
		<category><![CDATA[плагин]]></category>
		<category><![CDATA[производительность]]></category>

		<guid isPermaLink="false">http://www.jstoolbox.com/2008/06/16/analiz-proizvoditelnosti-dlya-jquery/</guid>
		<description><![CDATA[Джон Ресиг создал новый плагин для jQuery, который позволяет анализировать производительность работы скриптов, написанных с использованием этой библиотеки. Работает он довольно просто, нужно просто подключить плагин&#8230;:

&#60;script src="/javascripts/bundle.js">&#60;/script>
&#60;script src="http://dev.jquery.com/~john/plugins/profile/jquery-profile.js">&#60;/script>

Затем просто пользоваться сайтом, т.е. заставить поработать скрипты. Чтобы просмотреть результаты анализа производительности, нужно ввести в консоли команду jQuery.displayProfile(), результат будет примерно следующим:

Чтобы получить необработанные данные профайлера, воспользуйтесь [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://ejohn.org" title="Блог Джона Ресига">Джон Ресиг</a> создал новый плагин для <a href="http://jquery.com" title="библиотека jQuery">jQuery</a>, который позволяет анализировать производительность работы скриптов, написанных с использованием этой библиотеки. Работает он довольно просто, нужно просто подключить плагин&#8230;:</p>
<pre class="prettyprint">
&lt;script src="/javascripts/bundle.js">&lt;/script>
&lt;script src="http://dev.jquery.com/~john/plugins/profile/jquery-profile.js">&lt;/script>
</pre>
<p>Затем просто пользоваться сайтом, т.е. заставить поработать скрипты. Чтобы просмотреть результаты анализа производительности, нужно ввести в консоли команду <strong>jQuery.displayProfile()</strong>, результат будет примерно следующим:</p>
<div class="entry_picture" style="width:128px"><a href='http://www.jstoolbox.com/wp-content/uploads/2008/06/jquery-profile.png' title='результат анализа производительности jQuery'><img src='http://www.jstoolbox.com/wp-content/uploads/2008/06/jquery-profile.thumbnail.png' alt='результат анализа производительности jQuery' /></a></div>
<p>Чтобы получить необработанные данные профайлера, воспользуйтесь функцией <strong>jQuery.getProfile()</strong>.</p>
<p><a href="http://ejohn.org/blog/deep-profiling-jquery-apps/" title="Источник статьи" class="external">источник</a><a href="http://dev.jquery.com/~john/plugins/profile/jquery-profile.js" title="Скачать плагин" class="download" style="margin-left:18px">скачать</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jstoolbox.com/2008/06/16/analiz-proizvoditelnosti-dlya-jquery/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Bananascript.com &#8211; онлайн инструмент для сжатия скриптов</title>
		<link>http://www.jstoolbox.com/2008/05/16/bananascriptcom-onlajn-instrument-dlya-szhatiya-skriptov/</link>
		<comments>http://www.jstoolbox.com/2008/05/16/bananascriptcom-onlajn-instrument-dlya-szhatiya-skriptov/#comments</comments>
		<pubDate>Fri, 16 May 2008 09:09:34 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Оптимизация]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[сжатие]]></category>

		<guid isPermaLink="false">http://www.jstoolbox.com/2008/05/16/bananascriptcom-onlajn-instrument-dlya-szhatiya-skriptov/</guid>
		<description><![CDATA[Bananascript.com &#8211; это онлайн инструмент, который позволяет очень эффективно сжимать скрипты JavaScript, уменьшая из размер в среднем на 72% (по данным авторов этого сервиса).



Работает этот &#8220;packer&#8221; точно также, как и аналогичный, более распространенный инструмент от Dean Edwards. Чтобы сравнить эти два инструмента я попробовал сжать файл скрипта Lightgallery. Исходный размер скрипта &#8211; 21,3 Кб, паккер [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.bananascript.com/">Bananascript.com</a> &#8211; это онлайн инструмент, который позволяет очень эффективно сжимать скрипты JavaScript, уменьшая из размер в среднем на 72% (по данным авторов этого сервиса).</p>
<div class="entry_picture" style="width:378px">
<img src='http://www.jstoolbox.com/wp-content/uploads/2008/05/banana1.png' alt='bananascript.com - онлайн паккер' />
</div>
<p>Работает этот &#8220;packer&#8221; точно также, как и аналогичный, более распространенный инструмент от <a href="http://dean.edwards.name/packer/">Dean Edwards</a>. Чтобы сравнить эти два инструмента я попробовал сжать файл скрипта <a href="/proekty/lightgallery/">Lightgallery</a>. Исходный размер скрипта &#8211; 21,3 Кб, паккер Дина Эдвардса сжал его до 7,8 Кб, в то время как bananascript.com уменьшил размер до 5,8 Кб. Довольно таки неплохой результат.</p>
<div class="entry_picture" style="width:421px">
<img src='http://www.jstoolbox.com/wp-content/uploads/2008/05/banana.png' alt='bananascript.com - онлайн паккер' />
</div>
<p>Одно важное замечание &#8211; при подключении скриптов, созданных этим инструментом, обязательно указывать кодировку для скриптов ISO-8859-1:</p>
<pre class="prettyprint">
&lt;script src="lightgallery/lightgallery.banana.js" charset="ISO-8859-1" type="text/javascript">&lt;/script>
</pre>
<p>Если вам интересна тема сжатия скриптов, советую почитать статью <a href="http://webo.in/articles/habrahabr/11-minifing-javascript/">JavaScript: жать или не жать?</a> на <a href="http://webo.in/">webo.in</a>, в которой сравнивается ряд популярных инструментов для сжатия скриптов JavaScript.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jstoolbox.com/2008/05/16/bananascriptcom-onlajn-instrument-dlya-szhatiya-skriptov/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
	</channel>
</rss>
