Új hozzászólás Aktív témák

• #1748 Sk8erPeter nagyúr Zedz #1741

  Új Válasz 2015-01-09 14:48:30 #1748

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Sk8erPeter

  nagyúr

  válasz Zedz #1741 üzenetére

  "A kódmennyiséggel kapcsolatos felvetésed nem teljesen értem. [...] Szóval igazából a felhasználó ebből mit sem érzékel, hisz úgy is csak a kész .css fájlt kapja meg, amit akkor is megkapna ha mi azt "natívan" kódoljuk le."
  Itt a felhasználó annyiból kerül képbe, hogy mennyi adatot kell letöltenie, és az általa használt böngészőnek mennyi időbe kerül feldolgozni a betöltött kódot. Ez például mobileszközöknél nem (sem) mindegy. Szóval így van, úgyis csak a kész CSS-fájlt kapja meg, hiszen azt előre legenerálod a SASS/LESS/...-kódodból. Viszont nem mindegy, hogy ebből a kódból mekkora legenerált kódbázis keletkezik: előfordul olyan eset, hogy míg Te egy darab sort írsz az adott kódblokkba pl. SASS+Compass segítségével, addig a legenerált CSS-kód már fog tartalmazni vagy 10 vagy több (!) sort, ami ebből az 1-ből keletkezett. Ez több letöltendő és feldolgozandó adat.
  Csak egy kicsit talán túlzottan is extrém példa (most épp ez akadt a kezembe ), ami mondjuk annyiból sántít, hogy a Compass a SASS-hoz képest is bővebb, szimplán csak összehasonlítás kedvéért, hogy a mennyiséggel kapcsolatos érvet alátámasszam:
  http://compass-style.org/examples/compass/tables/striping/

  SCSS:
  @import "compass/utilities/tables/alternating-rows-and-columns";
  
  .example {
  table {
  $table-color: #7a98c6;
  @include alternating-rows-and-columns($table-color, adjust-hue($table-color, -120deg), #222222);
  }
  }

  az ebből keletkező CSS-kód:

  .example table th {
  background-color: white;
  }
  .example table th.even, .example table th:nth-child(2n) {
  background-color: #dddddd;
  }
  .example table tr.odd td, .example table tr:nth-child(2n+1) td {
  background-color: #98c67a;
  }
  .example table tr.odd td.even, .example table tr.odd td:nth-child(2n), .example table tr:nth-child(2n+1) td.even, .example table tr:nth-child(2n+1) td:nth-child(2n) {
  background-color: #76a458;
  }
  .example table tr.even td {
  background-color: #7a98c6;
  }
  .example table tr.even td.even, .example table tr.even td:nth-child(2n) {
  background-color: #5876a4;
  }
  .example table tfoot th, .example table tfoot td {
  background-color: white;
  }
  .example table tfoot th.even, .example table tfoot th:nth-child(2n), .example table tfoot td.even, .example table tfoot td:nth-child(2n) {
  background-color: #dddddd;
  }

  De mondjuk bevallom, ez tényleg túl extrém példa.

  De ha a böngésződ natívan támogatna olyan lehetőségeket, amiket eddig csak preprocessorral tudtál kényelmesen elérni (anélkül, hogy a kódod átláthatatlan lett volna, mert például ebben is nagy segítséget nyújtanak ezek az eszközök), akkor az mindenképp egy jobb irány.

Új hozzászólás Aktív témák