csso - npm Package Compare versions

Comparing version 1.3.4 to 1.3.5

lib/compressor.js

@@ -411,2 +411,3 @@ function TRBL(name, imp) {
 CSSOCompressor.prototype.compress = function(tree, ro) {
+    tree = tree || ['stylesheet'];
     this.init();
@@ -417,3 +418,4 @@ this.info = true;
         l0, l1 = 100000000000, ls,
-        x0, x1, xs;
+        x0, x1, xs,
+        protectedComment = this.findProtectedComment(tree);
 
@@ -449,5 +451,16 @@ // compression without restructure
 
-    return this.info ? x : cleanInfo(x);
+    if (protectedComment) x.splice(2, 0, protectedComment);
+
+    return x;
 };
 
+CSSOCompressor.prototype.findProtectedComment = function(tree) {
+    var token;
+    for (var i = 2; i < tree.length; i++) {
+        token = tree[i];
+        if (token[1] === 'comment' && token[2].length > 0 && token[2].charAt(0) === '!') return token;
+        if (token[1] !== 's') return;
+    }
+};
+
 CSSOCompressor.prototype.injectInfo = function(token) {
@@ -846,3 +859,7 @@ var t;
     if (token[2][2] === '0') {
-        if (token[3][2] === 's' && (declaration = this.findDeclaration(token)) && declaration[2][2][2] === '-moz-transition') return;
+        if (token[3][2] === 's' && (declaration = this.findDeclaration(token))) {
+            var declName = declaration[2][2][2];
+            if  (declName === '-moz-transition') return; // https://github.com/css/csso/issues/82
+            if  (declName === '-moz-animation' || declName === 'animation') return; // https://github.com/css/csso/issues/100
+        }
         return token[2];
@@ -849,0 +866,0 @@ }

MANUAL.en.md

@@ -50,3 +50,3 @@ # Table of contents
 * Before:
-
+```css
         .test
@@ -58,5 +58,8 @@ {
         }
+```
+
 * After:
-
+```css
         .test{margin-top:1em;margin-left:2em}
+```
 
@@ -70,11 +73,14 @@ The following examples are provided with whitespace left intact for better readability.
 * Before:
-
+```css
         .test {
             margin-top: 1em;;
         }
+```
+
 * After:
-
+```css
         .test {
             margin-top: 1em
         }
+```
 
@@ -86,3 +92,3 @@ ### 2.1.3. Removal of comments
 * Before:
-
+```css
         /* comment */
@@ -93,8 +99,31 @@
         }
+```
+
 * After:
-
+```css
         .test {
             margin-top: 1em
         }
+```
 
+If you want to save the comment, CSSO can do it with only one first comment in case it starts with `!`.
+
+* Before:
+```css
+        /*! MIT license */
+        /*! will be removed */
+
+        .test {
+            color: red
+        }
+```
+
+* After:
+```css
+        /*! MIT license */
+        .test {
+            color: red
+        }
+```
+
 ### 2.1.4. Removal of invalid @charset and @import declarations
@@ -109,3 +138,3 @@
 * Before:
-
+```css
         /* comment */
@@ -122,4 +151,6 @@ @charset 'UTF-8';
         @import "wrong";
+```
+
 * After:
-
+```css
         @charset 'UTF-8';
@@ -131,2 +162,3 @@ @import "test0.css";
         }
+```
 
@@ -138,3 +170,3 @@ ### 2.1.5. Minification of color properties
 * Before:
-
+```css
         .test {
@@ -147,4 +179,6 @@ color: yellow;
         }
+```
+
 * After:
-
+```css
         .test {
@@ -157,2 +191,3 @@ color: #ff0;
         }
+```
 
@@ -166,11 +201,14 @@ ### 2.1.6. Minification of 0
 * Before:
-
+```css
         .test {
             fakeprop: .0 0. 0.0 000 00.00 0px 0.1 0.1em 0.000em 00% 00.00% 010.00
         }
+```
+
 * After:
-
+```css
         .test {
             fakeprop: 0 0 0 0 0 0 .1 .1em 0 0% 0% 10
         }
+```
 
@@ -182,3 +220,3 @@ ### 2.1.7. Minification of multi-line strings
 * Before:
-
+```css
         .test[title="abc\
@@ -189,7 +227,10 @@ def"] {
         }
+```
+
 * After:
-
+```css
         .test[title="abcdef"] {
             background: url("foo/bar")
         }
+```
 
@@ -201,3 +242,3 @@ ### 2.1.8. Minification of the font-weight property
 * Before:
-
+```css
         .test0 {
@@ -210,4 +251,6 @@ font-weight: bold
         }
+```
+
 * After:
-
+```css
         .test0 {
@@ -220,2 +263,3 @@ font-weight: 700
         }
+```
 
@@ -229,3 +273,3 @@ ## 2.2. Structural optimizations
 * Before:
-
+```css
         .test0 {
@@ -246,4 +290,6 @@ margin: 0
         }
+```
+
 * After:
-
+```css
         .test0 {
@@ -261,2 +307,3 @@ margin: 0
         }
+```
 
@@ -268,3 +315,3 @@ ### 2.2.2. Merging blocks with identical properties
 * Before:
-
+```css
         .test0 {
@@ -285,4 +332,6 @@ margin: 0
         }
+```
+
 * After:
-
+```css
         .test0 {
@@ -299,2 +348,3 @@ margin: 0
         }
+```
 
@@ -309,3 +359,3 @@ ### 2.2.3. Removal of overridden properties
 * Before:
-
+```css
         .test {
@@ -317,4 +367,6 @@ color: red;
         }
+```
+
 * After:
-
+```css
         .test {
@@ -325,2 +377,3 @@ margin: 0;
         }
+```
 
@@ -332,3 +385,3 @@ #### 2.2.3.1. Removal of overridden shorthand properties
 * Before:
-
+```css
         .test {
@@ -338,7 +391,10 @@ border-top-color: red;
         }
+```
+
 * After:
-
+```css
         .test {
             border-color:green
         }
+```
 
@@ -350,11 +406,14 @@ ### 2.2.4. Removal of repeating selectors
 * Before:
-
+```css
         .test, .test {
             color: red
         }
+```
+
 * After:
-
+```css
         .test {
             color: red
         }
+```
 
@@ -371,3 +430,3 @@ ### 2.2.5. Partial merging of blocks
 * Before:
-
+```css
         .test0 {
@@ -385,4 +444,6 @@ color: red
         }
+```
+
 * After:
-
+```css
         .test0, .test1 {
@@ -395,2 +456,3 @@ color: red
         }
+```
 
@@ -400,3 +462,3 @@ Minification won't take place if character count of the properties to be copied is larger than character count of the overlapping properties.
 * Before:
-
+```css
         .test0 {
@@ -414,4 +476,6 @@ color: red
         }
+```
+
 * After:
-
+```css
         .test0 {
@@ -429,2 +493,3 @@ color: red
         }
+```
 
@@ -441,3 +506,3 @@ ### 2.2.6. Partial splitting of blocks
 * Before:
-
+```css
         .test0 {
@@ -454,4 +519,6 @@ color: red;
         }
+```
+
 * After:
-
+```css
         .test0 {
@@ -469,2 +536,3 @@ color: red
         }
+```
 
@@ -474,3 +542,3 @@ Minification won't take place if there's no gain in character count.
 * Before:
-
+```css
         .test0 {
@@ -487,4 +555,6 @@ color: red;
         }
+```
+
 * After:
-
+```css
         .test0 {
@@ -501,2 +571,3 @@ color: red;
         }
+```
 
@@ -508,3 +579,3 @@ ### 2.2.7. Removal of empty ruleset and at-rule
 * Before:
-
+```css
         .test {
@@ -525,5 +596,8 @@ color: red
         }
+```
+
 * After:
-
+```css
         .test{color:red;border:none}
+```
 
@@ -535,3 +609,3 @@ ### 2.2.8. Minification of margin and padding properties
 * Before:
-
+```css
         .test0 {
@@ -563,4 +637,6 @@ margin-top: 1em;
         }
+```
+
 * After:
-
+```css
         .test0 {
@@ -581,2 +657,3 @@ margin: 1em 2em 3em 4em
         }
+```
 
@@ -604,3 +681,3 @@ # 3. Recommendations
 * Before:
-
+```css
         .test0 {
@@ -617,5 +694,8 @@ color: red
         }
+```
+
 * After (53 characters):
-
+```css
         .test0{color:red}.test1{color:green}.test2{color:red}
+```
 
@@ -625,3 +705,3 @@ Good:
 * Before:
-
+```css
         .test1 {
@@ -638,5 +718,8 @@ color: green
         }
+```
+
 * After (43 characters):
-
+```css
         .test1{color:green}.test0,.test2{color:red}
+```
 
@@ -650,3 +733,3 @@ ## 3.4. Using !important
 * Before:
-
+```css
         .test {
@@ -656,5 +739,8 @@ margin-left: 2px !important;
         }
+```
+
 * After (43 characters):
-
+```css
         .test{margin-left:2px!important;margin:1px}
+```
 
@@ -664,3 +750,3 @@ Good:
 * Before:
-
+```css
         .test {
@@ -670,4 +756,7 @@ margin-left: 2px;
         }
+```
+
 * After (17 characters):
-
+```css
         .test{margin:1px}
+```

MANUAL.ru.md

@@ -54,3 +54,3 @@ # Содержание
 * Было:
-
+```css
         .test
@@ -62,5 +62,8 @@ {
         }
+```
+
 * Стало:
-
+```css
         .test{margin-top:1em;margin-left:2em}
+```
 
@@ -74,11 +77,14 @@ Для большего удобства чтения текст остальных примеров приводится с пробелами (переводом строки и т.п.).
 * Было:
-
+```css
         .test {
             margin-top: 1em;;
         }
+```
+
 * Стало:
-
+```css
         .test {
             margin-top: 1em
         }
+```
 
@@ -90,3 +96,3 @@ ### 2.1.3. Удаление комментариев
 * Было:
-
+```css
         /* comment */
@@ -97,8 +103,31 @@
         }
+```
+
 * Стало:
-
+```css
         .test {
             margin-top: 1em
         }
+```
 
+Если вам требуется сохранить комментарий, CSSO позволяет это сделать только с одним первым комментарием, если его текст начинается с `!`.
+
+* Было:
+```css
+        /*! MIT license */
+        /*! will be removed */
+
+        .test {
+            color: red
+        }
+```
+
+* Стало:
+```css
+        /*! MIT license */
+        .test {
+            color: red
+        }
+```
+
 ### 2.1.4. Удаление неправильных @charset и @import
@@ -113,3 +142,3 @@
 * Было:
-
+```css
         /* comment */
@@ -126,4 +155,6 @@ @charset 'UTF-8';
         @import "wrong";
+```
+
 * Стало:
-
+```css
         @charset 'UTF-8';
@@ -135,2 +166,3 @@ @import "test0.css";
         }
+```
 
@@ -142,3 +174,3 @@ ### 2.1.5. Минимизация цвета
 * Было:
-
+```css
         .test {
@@ -151,4 +183,6 @@ color: yellow;
         }
+```
+
 * Стало:
-
+```css
         .test {
@@ -161,2 +195,3 @@ color: #ff0;
         }
+```
 
@@ -170,11 +205,14 @@ ### 2.1.6. Минимизация 0
 * Было:
-
+```css
         .test {
             fakeprop: .0 0. 0.0 000 00.00 0px 0.1 0.1em 0.000em 00% 00.00% 010.00
         }
+```
+
 * Стало:
-
+```css
         .test {
             fakeprop: 0 0 0 0 0 0 .1 .1em 0 0% 0% 10
         }
+```
 
@@ -186,3 +224,3 @@ ### 2.1.7. Слияние многострочных строк в однострочные
 * Было:
-
+```css
         .test[title="abc\
@@ -193,7 +231,10 @@ def"] {
         }
+```
+
 * Стало:
-
+```css
         .test[title="abcdef"] {
             background: url("foo/bar")
         }
+```
 
@@ -205,3 +246,3 @@ ### 2.1.8. Минимизация font-weight
 * Было:
-
+```css
         .test0 {
@@ -214,4 +255,6 @@ font-weight: bold
         }
+```
+
 * Стало:
-
+```css
         .test0 {
@@ -224,2 +267,3 @@ font-weight: 700
         }
+```
 
@@ -233,3 +277,3 @@ ## 2.2. Минимизация с изменением структуры
 * Было:
-
+```css
         .test0 {
@@ -250,4 +294,6 @@ margin: 0
         }
+```
+
 * Стало:
-
+```css
         .test0 {
@@ -265,2 +311,3 @@ margin: 0
         }
+```
 
@@ -272,3 +319,3 @@ ### 2.2.2. Слияние блоков с одинаковыми свойствами
 * Было:
-
+```css
         .test0 {
@@ -289,4 +336,6 @@ margin: 0
         }
+```
+
 * Стало:
-
+```css
         .test0 {
@@ -303,2 +352,3 @@ margin: 0
         }
+```
 
@@ -315,3 +365,3 @@ ### 2.2.3. Удаление перекрываемых свойств
 * Было:
-
+```css
         .test {
@@ -323,4 +373,6 @@ color: red;
         }
+```
+
 * Стало:
-
+```css
         .test {
@@ -331,2 +383,3 @@ margin: 0;
         }
+```
 
@@ -338,3 +391,3 @@ #### 2.2.3.1. Удаление перекрываемых shorthand свойств
 * Было:
-
+```css
         .test {
@@ -344,7 +397,10 @@ border-top-color: red;
         }
+```
+
 * Стало:
-
+```css
         .test {
             border-color:green
         }
+```
 
@@ -356,11 +412,14 @@ ### 2.2.4. Удаление повторяющихся селекторов
 * Было:
-
+```css
         .test, .test {
             color: red
         }
+```
+
 * Стало:
-
+```css
         .test {
             color: red
         }
+```
 
@@ -377,3 +436,3 @@ ### 2.2.5. Частичное слияние блоков
 * Было:
-
+```css
         .test0 {
@@ -391,4 +450,6 @@ color: red
         }
+```
+
 * Стало:
-
+```css
         .test0, .test1 {
@@ -401,2 +462,3 @@ color: red
         }
+```
 
@@ -406,3 +468,3 @@ Если в символах размер копируемых селекторов больше размера пересекающегося набора свойств, минимизация не происходит.
 * Было:
-
+```css
         .test0 {
@@ -420,4 +482,6 @@ color: red
         }
+```
+
 * Стало:
-
+```css
         .test0 {
@@ -435,2 +499,3 @@ color: red
         }
+```
 
@@ -447,3 +512,3 @@ ### 2.2.6. Частичное разделение блоков
 * Было:
-
+```css
         .test0 {
@@ -460,4 +525,6 @@ color: red;
         }
+```
+
 * Стало:
-
+```css
         .test0 {
@@ -475,2 +542,3 @@ color: red
         }
+```
 
@@ -480,3 +548,3 @@ Если в символах размер копируемых селекторов больше размера пересекающегося набора свойств, минимизация не происходит.
 * Было:
-
+```css
         .test0 {
@@ -493,4 +561,6 @@ color: red;
         }
+```
+
 * Стало:
-
+```css
         .test0 {
@@ -507,2 +577,3 @@ color: red;
         }
+```
 
@@ -514,3 +585,3 @@ ### 2.2.7. Удаление пустых ruleset и at-rule
 * Было:
-
+```css
         .test {
@@ -531,5 +602,8 @@ color: red
         }
+```
+
 * Стало:
-
+```css
         .test{color:red;border:none}
+```
 
@@ -541,3 +615,3 @@ ### 2.2.8. Минимизация margin и padding
 * Было:
-
+```css
         .test0 {
@@ -569,4 +643,6 @@ margin-top: 1em;
         }
+```
+
 * Стало:
-
+```css
         .test0 {
@@ -587,2 +663,3 @@ margin: 1em 2em 3em 4em
         }
+```
 
@@ -592,3 +669,3 @@ Минимизация не происходит в случаях, когда один набор `selector X / shorthands` прерывается другим набором `selector Y / shorthands`.
 * Было:
-
+```css
         .test1 {
@@ -613,4 +690,6 @@ margin-top: 0
         }
+```
+
 * Стало:
-
+```css
         .test1 {
@@ -629,5 +708,6 @@ margin-top: 0
         }
+```
 
 * Могло быть (неправильно):
-
+```css
         .test2 {
@@ -640,2 +720,3 @@ margin-top: 100px
         }
+```
 
@@ -647,5 +728,7 @@ К сожалению, результат рендеринга последнего варианта отличается от рендеринга исходного стиля, потому такая минимизация недопустима.
 Если в группе селекторов UA обнаружит неподдерживаемый селектор, он, согласно \[[CSS 3 / Selectors / 5. Groups of selectors](http://www.w3.org/TR/selectors/#grouping)\], посчитает неподдерживаемой всю группу и не применит стили к перечисленным в ней селекторам. Этим нередко пользуются для разграничения стилей по браузерам. Вот [пример](http://pornel.net/firefoxhack) метода:
+```css
 
         #hackme, x:-moz-any-link { Firefox 2.0 here }
         #hackme, x:-moz-any-link, x:default { Firefox 3.0 and newer }
+```
 
@@ -659,3 +742,3 @@ Чтобы сохранить такие блоки, но в то же время минимизировать то, что поддаётся оптимизации, CSSO применяет нижеперечисленные правила. Предполагается, что вместе эти правила составляют компромисс, удовлетворяющий большинство пользователей.
 * Было:
-
+```css
         a {
@@ -668,4 +751,6 @@ property: value0
         }
+```
+
 * Стало (структура не изменилась):
-
+```css
         a {
@@ -678,2 +763,3 @@ property: value0
         }
+```
 
@@ -683,3 +769,3 @@ Если же группы селекторов образуют одинаковую "сигнатуру псевдоклассов" (исключается ситуация, в которой браузер поддерживает одну группу, но не поддерживает другую), минимизация происходит.
 * Было:
-
+```css
         a, x:-vendor-class {
@@ -692,7 +778,10 @@ property: value0
         }
+```
+
 * Стало:
-
+```css
         a, b, x:-vendor-class {
             property: value1
         }
+```
 
@@ -704,3 +793,3 @@ #### 2.2.9.2. Минимизация общеподдерживаемых псевдоклассов и псевдоэлементов
 * Было:
-
+```css
         a, x:active {
@@ -713,3 +802,6 @@ color: red
         }
+```
+
 * Стало:
+```css
         x:active {
@@ -722,2 +814,3 @@ color: red
         }
+```
 
@@ -729,3 +822,3 @@ #### 2.2.9.3. Минимизация :before и :after
 * Было:
-
+```css
         a, x:before {
@@ -738,7 +831,10 @@ color: red
         }
+```
+
 * Стало:
-
+```css
         a, x:before, x:after {
             color:red
         }
+```
 
@@ -748,3 +844,3 @@ Тем не менее, блоки, в которых участвует только один из этих псевдоэлементов, не объединяются:
 * Было:
-
+```css
         a {
@@ -757,4 +853,6 @@ color: red
         }
+```
+
 * Стало:
-
+```css
         a {
@@ -767,2 +865,3 @@ color: red
         }
+```
 
@@ -792,3 +891,3 @@ В примере выше можно заметить, что удаление селектора `a` из второго блока не повлияло бы на итоговый рендеринг, но в общем случае это опасная минимизация, потому не применяется.
 * Было:
-
+```css
         .test0 {
@@ -805,5 +904,8 @@ color: red
         }
+```
+
 * Стало (53 символа):
-
+```css
         .test0{color:red}.test1{color:green}.test2{color:red}
+```
 
@@ -813,3 +915,3 @@ Хорошо:
 * Было:
-
+```css
         .test1 {
@@ -826,5 +928,8 @@ color: green
         }
+```
+
 * Стало (43 символа):
-
+```css
         .test1{color:green}.test0,.test2{color:red}
+```
 
@@ -838,3 +943,3 @@ ## 3.4. Использование !important
 * Было:
-
+```css
         .test {
@@ -844,5 +949,8 @@ margin-left: 2px !important;
         }
+```
+
 * Стало (43 символа):
-
+```css
         .test{margin-left:2px!important;margin:1px}
+```
 
@@ -852,3 +960,3 @@ Хорошо:
 * Было:
-
+```css
         .test {
@@ -858,4 +966,7 @@ margin-left: 2px;
         }
+```
+
 * Стало (17 символов):
-
+```css
         .test{margin:1px}
+```

package.json

 {
     "name": "csso",
     "description": "CSSO — CSS optimizer",
-    "version": "1.3.4",
+    "version": "1.3.5",
     "homepage": "http://github.com/css/csso",
@@ -6,0 +6,0 @@ "author": "Sergey Kryzhanovsky <[e-mail]> (http://github.com/afelix)",

README.md

@@ -131,3 +131,3 @@ # 1. Introduction
 * implementation&nbsp;— Sergey Kryzhanovsky (<[e-mail]>)
-* english translation&nbsp;— Leonid Khachaturov ([e-mail])
+* english translation&nbsp;— Leonid Khachaturov (<[e-mail]>)
 
@@ -134,0 +134,0 @@ # 6. And finally

README.ru.md

@@ -131,3 +131,3 @@ # 1. Описание
 * реализация&nbsp;— Сергей Крыжановский (<[e-mail]>)
-* перевод на английский язык&nbsp;— Leonid Khachaturov ([e-mail])
+* перевод на английский язык&nbsp;— Leonid Khachaturov (<[e-mail]>)
 
@@ -134,0 +134,0 @@ # 6. Остальное

src/compressor.shared.js

@@ -245,2 +245,3 @@
 CSSOCompressor.prototype.compress = function(tree, ro) {
+    tree = tree || ['stylesheet'];
     this.init();
@@ -251,3 +252,4 @@ this.info = true;
         l0, l1 = 100000000000, ls,
-        x0, x1, xs;
+        x0, x1, xs,
+        protectedComment = this.findProtectedComment(tree);
 
@@ -283,5 +285,16 @@ // compression without restructure
 
-    return this.info ? x : cleanInfo(x);
+    if (protectedComment) x.splice(2, 0, protectedComment);
+
+    return x;
 };
 
+CSSOCompressor.prototype.findProtectedComment = function(tree) {
+    var token;
+    for (var i = 2; i < tree.length; i++) {
+        token = tree[i];
+        if (token[1] === 'comment' && token[2].length > 0 && token[2].charAt(0) === '!') return token;
+        if (token[1] !== 's') return;
+    }
+};
+
 CSSOCompressor.prototype.injectInfo = function(token) {
@@ -680,3 +693,7 @@ var t;
     if (token[2][2] === '0') {
-        if (token[3][2] === 's' && (declaration = this.findDeclaration(token)) && declaration[2][2][2] === '-moz-transition') return;
+        if (token[3][2] === 's' && (declaration = this.findDeclaration(token))) {
+            var declName = declaration[2][2][2];
+            if  (declName === '-moz-transition') return; // https://github.com/css/csso/issues/82
+            if  (declName === '-moz-animation' || declName === 'animation') return; // https://github.com/css/csso/issues/100
+        }
         return token[2];
@@ -683,0 +700,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

554733

increased by3.79%

Number of package files

1330

increased by1.14%

Lines of code

11003

increased by0.91%

No dependency changes