jquery - remove - Dejando fuera el último punto y coma de un bloque CSS

jquery set style

Question

Un par de preguntas sobre esto:

• ¿Es buena práctica?
• ¿Resultará, a gran escala, en mejores tiempos de carga?
• ¿Puede dar lugar a que los navegadores se ''rompan''?
• ¿Es lo mismo cierto para la última función en Javascript (/ jQuery)?

Lo que quiero decir es cosas como esta:

#myElement {
  position: absolute;
  top: 0;
  left: 0
}

Answer 1

¿Es buena práctica?

Me gustaría evitarlo, ya que un proceso de minificación inteligente manejará esto por usted y presentaría errores si olvidara colocar el punto y coma al agregar nuevas definiciones.

¿Resultará, a gran escala, en mejores tiempos de carga?

Sí, menor tamaño de archivo. Sin embargo, la diferencia es insignificante y los procesos de minificación lo harán automáticamente.

¿Puede dar lugar a que los navegadores se ''rompan''?

No

¿Es lo mismo cierto para la última función en Javascript (/ jQuery)?

No, sería "no válido" excluir los puntos y coma al final de una declaración de función.

Answer 2

¿Es buena práctica?

No es una buena práctica excluir manualmente los puntos y coma. Esto es simplemente porque es fácil pasarlo por alto al agregar más estilos, especialmente si está trabajando en un equipo:

Imagina que empiezas con:

.foo {
    background-color: #F00;
    color: #000             <-- missing semi-colon
}

Y luego alguien agrega algunos estilos:

.foo {
    background-color: #F00;
    color: #000             <-- missing semi-colon
    width: 30px;
    z-index: 100;
}

De repente, el otro desarrollador está perdiendo el tiempo averiguando por qué su declaración de width no funciona (o, peor aún, no se da cuenta de que no funciona). Es más seguro dejar el punto y coma en punto.

¿Resultará, a gran escala, en mejores tiempos de carga?

Definitivamente, para cada bloque, guardarías un par de bytes. Estos se suman, especialmente para hojas de estilo grandes. En lugar de preocuparse por estas mejoras de rendimiento, es mejor usar un compresor CSS, como el compresor YUI, para eliminar automáticamente los puntos y comas finales.

¿Puede resultar en que los navegadores se ''rompan''?

No, es seguro, ya que los navegadores implementan esta parte de la especificación correctamente. La especificación CSS2 define así una declaración:

Una declaración está vacía o consiste en un nombre de propiedad, seguido de dos puntos (:), seguido de un valor de propiedad.

Más importante:

... múltiples declaraciones para el mismo selector se pueden organizar en grupos separados por punto y coma (;).

Esto significa que ; se utiliza para separar declaraciones múltiples, pero no se necesita para terminarlas.

¿Es lo mismo cierto para la última función en Javascript?

JavaScript es una bestia completamente diferente con una especificación completamente diferente. Esta pregunta en particular ha sido respondida en profundidad muchas veces antes en .

Answer 3

Esta es una pregunta duplicada. Mira aquí:

Punto y coma en CSS

Con respecto a la aplicación de un punto y coma en JavaScript, las funciones no deben terminar con un punto y coma a menos que se asignen de forma declarativa, a saber. var a = function() {}; Sin embargo, los navegadores realizan la inserción automática de punto y coma si inadvertidamente (o intencionalmente) los omite.

Answer 4

La eliminación de las paradas de declaración no "romperá" los navegadores, pero aún debe dejarse para los minificadores automáticos (especialmente si está preocupado por los tiempos de carga, los puntos y coma por sí solos no suman mucho), pero deben evitarse en la fuente por razones de mantenimiento.

Si está buscando las mejores prácticas, las reglas de formato CSS en la guía de estilo css de Google son un muy buen lugar para comenzar, no para aplicar su sugerencia a ciegas sino para ver su razonamiento.

Use un punto y coma después de cada declaración. Termine cada declaración con un punto y coma por razones de consistencia y extensibilidad.

/* Not recommended */
.test {
  display: block;
  height: 100px
}
/* Recommended */
.test {
  display: block;
  height: 100px;
}

Sin embargo, Javascript es una historia diferente: la respuesta corta es siempre usar punto y coma, nunca confíe en la inserción implícita , pero nunca he visto una respuesta mejor y más completa que la que prescribe Google en otra de sus guías de estilo :

Hay un par de lugares donde los puntos y coma que faltan son particularmente peligrosos:

// 1.
MyClass.prototype.myMethod = function() {
  return 42;
}  // No semicolon here.

(function() {
  // Some initialization code wrapped in a function to create a scope for locals.
})();



var x = {
  ''i'': 1,
  ''j'': 2
}  // No semicolon here.

// 2.  Trying to do one thing on Internet Explorer and another on Firefox.
// I know you''d never write code like this, but throw me a bone.
[normalVersion, ffVersion][isIE]();



var THINGS_TO_EAT = [apples, oysters, sprayOnCheese]  // No semicolon here.

// 3. conditional execution a la bash
-1 == resultOfOperation() || die();

¿Así que lo que sucede?

1. Error de JavaScript: primero se llama a la función que devuelve 42 con la segunda función como parámetro, luego el número 42 se "llama" y se genera un error.
2. Lo más probable es que obtenga un error de ''no existe tal propiedad en indefinido'' en el tiempo de ejecución cuando intenta llamar a x[ffVersion][isIE]() .
3. die se llama a menos que resultOfOperation() sea NaN y THINGS_TO_EAT se le asigne el resultado de die() .

¿Por qué?

JavaScript requiere que las declaraciones terminen con un punto y coma, excepto cuando piense que puede inferir de forma segura su existencia. En cada uno de estos ejemplos, se utiliza una declaración de función u objeto o matriz literal dentro de una declaración. Los corchetes de cierre no son suficientes para señalar el final de la declaración. Javascript nunca termina una declaración si el siguiente token es un operador de infijo o corchete.

Esto realmente ha sorprendido a la gente, así que asegúrese de que sus tareas terminen con puntos y coma.

Answer 5

Mejorará ligeramente el tiempo de carga. Con un archivo (s) CSS lo suficientemente grande, incluso puede ser perceptible (bueno, la minificación en general puede ser suficiente, dudo que eliminar el punto y coma final sea suficiente).

Sin embargo, si te preocupa mucho el tiempo de carga, deberías usar un programa para minimizar tu CSS, no intentar hacerlo manualmente. El CSS minificado es (todo menos) imposible de leer. Es una mala práctica usar esto en el "código fuente", por así decirlo, porque es muy fácil olvidarlo.

Answer 6

Para CSS, probé esto en IE9, FF, GC, Safari y Opera, y no hizo una diferencia.

En cuanto a Javascript, recibí un error en FF y GC, así que diría que no haga esto en los scripts. En cuanto al tiempo de carga, la diferencia no se notará de ninguna manera.

Answer 7

Según mi experiencia, 1) No es una buena práctica 2) Incluso en una escala muy grande, los tiempos de carga serán insignificantes. 3) No tengo conocimiento de ningún navegador que se rompería con esto. 4) Lo mismo vale para jQuery.

Answer 8

• ¿Es buena práctica?

En mi opinión, no. Si agrega una regla debajo de la última regla, es fácil olvidarse de agregar el punto y coma.

• ¿Resultará, a gran escala, en mejores tiempos de carga?

No puedo imaginar que haría una gran diferencia en el tiempo de carga.

• ¿Puede dar lugar a que los navegadores se ''rompan''?

No, los puntos y coma solo son necesarios para separar las reglas en los bloques CSS. Los puntos y coma son delimitadores, no terminadores.

• ¿Es lo mismo cierto para la última función en Javascript (/ jQuery)?

Sí, no lo deje en el intérprete de JavaScript para agregar puntos y comas.

Answer 9

• No, omitir el punto y coma introducirá una gran cantidad de riesgo en su aplicación, será muy fácil pasarlo por alto agregándolo de nuevo si agrega más estilos a su elemento. En ese momento, está confiando en sus procesos manuales y en la atención a los detalles para asegurarse de no haber perdido accidentalmente sus líneas que no son punto y coma. Peor aún, tendría que revisar físicamente su archivo css cada vez que estuviera listo para comenzar la producción para asegurarse de no arruinar ninguna de las líneas de estilo finales en cada elemento.

• Posiblemente, ya que el archivo sería más pequeño, pero la diferencia debería ser despreciable. Si está preocupado por los tiempos de carga, Gzipping sus archivos antes de colocarlos en el servidor le será muy útil.

• La mayoría de los navegadores son lo suficientemente inteligentes como para saber lo que quieres decir, pero aún debes preocuparte por arruinar tu archivo CSS al no tener cuidado con el último estilo.