|
|||||||||||||
| Registrarse | FAQ/Ayuda | Posts de hoy | Tags | ||||||||||
|
| |||
| Tags: Ninguna | |||
|
|
|
LinkBack | Herramientas |
|
|
#1 |
|
Zend Certified Engineer
ex-admin :)
![]() |
nueva class publicada: CSStacker
A partir de hoy se lanza mi segunda class al público en general: es una class que es capaz de tomar varios CSS, comprimirlo, optimizarlo y enviarlo hacia el cliente (con gzip).
De esta forma, el CSS principal de CHW por ejemplo, pasa de pesar 43876 bytes a 5802 bytes, una compresión de un 87%! Cómo se hace esto? Muy simple: se toma el o los CSS a procesarse, se eliminan los comentarios, los retornos de carros, los espacios que sobran, los tabs que sobran, se cambian todos los 0px a 0, los colores se convierten a su respectivo código corto y por último los colores se tratan de acortar de #EEAA11 a #EA1. Por último, a ese archivo resultante se le aplica gzip y se manda al cliente. Por último, si el cliente ya tiene en su caché el CSS, simplemente se manda un código HTTP de que el archivo no ha sido modificado, reduciendo de esta manera ancho de banda. Mi class trabaja con dos formas de caché, ambos configurables: El primer caché se genera en el servidor. De esta manera, se pueden dar distintas combinaciones para distintos perfiles. Si en una página cargo hola.css y chao.css y en otra página cargo hola.css y mundo.css, ambos tendrán una caché distinta. Esta caché se puede activar o desactivar, aunque desactivado no tiene mucha gracia ya que cada vez que hay un request, se debe realizar todo el proceso de arriba nuevamente. La segunda caché es la del cliente: si el CSS no ha cambiado entonces no descarga nada. Si en cambio, el archivo fuente ha cambiado o el cliente no tiene en caché el CSS se descarga nuevamente. Esta caché se puede desactivar como también regular el tiempo que dura. ¿Qué ventajas tiene esto? 1.- Los CSS quedan originales, no teniendo que renombrarse. Es tan fácil como llegar y editarlos en caso que sea necesario. Cuando se editan, se actualiza automáticamente la caché interna y se manda la nueva versión al cliente. 2.- No más problemas extraños con distintos navegadores: la class se encarga de hablar con el navegador. 3.- Menos HTTP requests por cliente. 4.- Menos peso que transferir hacia el cliente. 5.- De fácil integración: sólo son 2 líneas de código Por último, también es posible enviar el CSS como un archivo (recomendado) o bien imprimirlo inline como parte del estilo. Y de dónde se puede descargar esta maravilla? De acá: CSS Stacker and Compressor - PHP Classes En ese link se encuentra la class, documentación completa (en inglés, sorry es requisito del sitio), el archivo de configuración necesaria y por último un par de ejemplos. Cualquier duda, puede ser mediante phpclasses.org o bien por acá Saludos !! Editado por unreal4u en 01-feb-2010 a las 12:19. |
|
|
|
|
|
#2 |
|
Gordo en rehabilitación
![]() Registrado: septiembre-2006
Ubicación: -37.459999,-72.36
Posts: 7.467
![]() |
Re: nueva class publicada: CSStacker
me da verguenza, soy una sanguijuela, todavia no publico ninguna clase en phpclasess
Vamos a tasar tu clase asi que puede que la modifique para que funcione con CodeIgniter, bajo la logica del CI, si lo hago te aviso |
|
|
|
|
|
#3 | |
|
Zend Certified Engineer
ex-admin :)
![]() |
Re: nueva class publicada: CSStacker
Quote:
BTW, estoy top #8 ![]() |
|
|
|
|
|
|
#4 |
|
Gordo en rehabilitación
![]() Registrado: septiembre-2006
Ubicación: -37.459999,-72.36
Posts: 7.467
![]() |
Re: nueva class publicada: CSStacker
ya se me ocurrio una idea para aplicar en CodeIgniter
Una GUI que permita al usuario determinar el orden en que se cargan los CSS. Imagino lo siguiente: Leer carpeta donde se guardan los CSS Dibujar en pantalla una GUI con Jquery que permita ordenarlos css arrastrando arriba o abajo(lo he usado para ordenar imagenes en una galeria). TEnemos una lista de css en un archivo php, separados por coma(juanelo.css, XD.css,donramon.css) y ademas tenemos la lista de css al leer carpetas Comparo la lista V/S la lectura de la carpeta css, si coinciden agrego un dato mas al array con el valor 1 Luego ordeno el array de archivos por el dato que contiene el valor 1 Los que tienen 1 los dibujo chekados Los que no tienen 1 los dibujo abajo de los checkeados, desde luego sin chekear. Ahi el user puede ordenarlos a su gusto Cuando el user ya determino el orden, aprieta guardar y se guarda el archivo .php con los textos separados por coma. Luego desde tu clase leo ese archivo php, para determnar que poner en $csstacker->add(array('narf.css','xd.css','css/rolfmao.css','css/lol.css')); por lo que veo en el orden que ingresas datos al array es el orden en que se imprime verdad? PD: Ojala que se entienda, porque yo me entiendo clarito jajajajaj La lista de los archivos leidos de carpeta los meto en un array, si el array |
|
|
|
|
|
#5 |
|
Zend Certified Engineer
ex-admin :)
![]() |
Re: nueva class publicada: CSStacker
claro, el orden importa por si en dos CSS distintos hay alguna regla que se superpone a la otra, por lo tanto, los que vengan primero se imprimirán primero y los que vienen después se imprimirán después (ooooooh... ando grandes pensadores hoy jajajajjaja )
Los puedes meter al stack ya sea mediante un arreglo o bien invocando múltiples veces el add(string). También puedes hacer primero un add(array) y después un add(string), pero siempre el que quede como último se imprimirá al último. En sí, el método add no hace nada más que agregar los nombres a un arreglo siempre y cuando los archivos existan y se puedan leer. (tomando en cuenta la ruta relativa al que creó el objeto). Es print_me() el que realiza toda la pega pesada de verificar si acaso existe la caché, está actualizada, la deberá crear de nuevo o no y finalmente mandar la salida. Saludos !! ---- PD: de todas maneras, si vas a modificar la class, aguántate un cachito que estoy arreglando y agregando algunas cositas, más que nada validaciones y voi a ver si puedo hacer que cuando una declaración está múltiples veces sólo se quede con la última hecha La idea es lanzar la v1.2 Saludos !! Editado por unreal4u en 25-ene-2010 a las 18:56. Razón: Post unidos |
|
|
|
|
|
#6 | |
|
Gordo en rehabilitación
![]() Registrado: septiembre-2006
Ubicación: -37.459999,-72.36
Posts: 7.467
![]() |
Re: nueva class publicada: CSStacker
Quote:
por el momento el cambio que haria es minimo. |
|
|
|
|
|
|
#7 |
|
Zend Certified Engineer
ex-admin :)
![]() |
Re: nueva class publicada: CSStacker
This week - Top downloaded classes 4 CSS Stacker and Compressor Camilo Sperberg This week - Top downloaded authors 8 Camilo Sperberg pensaba subir la v1.2 hoy, pero mejor me aguanto unos dos días más ![]() |
|
|
|
|
|
#8 |
|
Gordo en rehabilitación
![]() Registrado: septiembre-2006
Ubicación: -37.459999,-72.36
Posts: 7.467
![]() |
Re: nueva class publicada: CSStacker
jajaj, que top
|
|
|
|
|
|
#9 |
|
Zend Certified Engineer
ex-admin :)
![]() |
Re: nueva class publicada: CSStacker
publiqué la versión 1.3 denante
Son muuuuuuuuuchas cosas nuevas y muuuuuuuuchos arreglos de pifias Saludos !! |
|
|
|
|
|
#10 |
|
Usuario
Registrado: febrero-2007
Posts: 167
![]() |
Re: nueva class publicada: CSStacker
Felicitaciones men!!
tienes alguna nueva idea en mente? |
|
|
|
|
|
#11 |
|
Zend Certified Engineer
ex-admin :)
![]() |
Re: nueva class publicada: CSStacker
tenía dos, pero las descarté
Una era para enviar mails con cabeceras anti-spam y toda la challa... después me di cuenta que existían 20.000 classes que hacían lo mismo. Descartado. Después pensé en hacer una class super simple que lo único que hiciera era crear un thumbnail y nada más. La misma semana en que lo pensé salió una que hacía justamente eso Lo que tengo en mente hace mucho tiempo, es crear algo que sea tipo html2doc, pero eso sería bastante complicado. La razón? No hay ninguno que sea bueno y casi todos pescan lo que sea que haya hasta <body> y pa fuera, por lo tanto, no se aplica estilo, no se aplica nada de eso. Para poder aplicar el estilo, la class tendría que; primero que nada conocer CSS, después interpretarlo y finalmente aplicarlo; pero antes de eso tendría que bajarlo (mediante cURL). Después me tiraría con el cachito de crear un documento .doc compatible. Hasta crear un excel es más fácil, pero existen tb 20.000 class que crean excel. Sin embargo, todo va a depender muchísimo de qué pega tendré que hacer: CSStacker nació debido a que necesitaba cargar diversos CSS simultáneos de distintas partes, y quise unirlos todos y aprovechar de comprimirlos, mientras que la class de MySQLi nació debido a que necesitaba aprender OOP en PHP y además necesitaba una class que se conectara a MySQL y me permitiera hacer consultas de una forma fácil y rápida. A medida que los vaya necesitando y vaya cachando que no hay mucha oferta, me aplico Saludos !! |
|
|
|
|
|
#12 | |
|
Gordo en rehabilitación
![]() Registrado: septiembre-2006
Ubicación: -37.459999,-72.36
Posts: 7.467
![]() |
Re: nueva class publicada: CSStacker
Quote:
porque las que yo he probado, me han metido en lista negra por spammer, y lo unico que hacia era enviar peticiones hello para saber si los correos existian, no encontre ninguna clase que hiciera la pega completa |
|
|
|
|
|
|
#13 |
|
Usuario
Registrado: febrero-2007
Posts: 167
![]() |
Re: nueva class publicada: CSStacker
No se si existirá ya o si sería posible...
pero algo muy útil sería alguna clase como la que creaste para las consultas a mysql, pero sobre validación de formularios. Eso si que es algo tedioso. |
|
|
|
|
|
#14 | ||
|
Zend Certified Engineer
ex-admin :)
![]() |
Re: nueva class publicada: CSStacker
Quote:
Quote:
(prefiero ocupar filter_var, incluido desde PHP5.2 en adelante, es bastante más fácil Saludos !! |
||
|
|
|
|
|
#15 |
|
Gordo en rehabilitación
![]() Registrado: septiembre-2006
Ubicación: -37.459999,-72.36
Posts: 7.467
![]() |
Re: nueva class publicada: CSStacker
lo que yo haria es crear un framework, que te permita crear una GUI estandar para aplicaciones CRUD, como lo hace OpenXava para JAVA
Donde el programador solo se preocupa de definir un modelo y de entragar datos basicos de longitud de caracteres, tipo de campo, etc. Hasta el momento en php he visto weas muy complejas, que alfinal es mucha caca para lo que necesita hacer. |
|
|
|
|
| Herramientas | |
|
|
|||||