#121 La verdad sobre el desempeño de los selectores CSS

La verdad sobre el desempeño de los selectores CSS

Con sitios web cada vez más complejos, se ha vuelto muy importante poder medir el desempeño de la carga y actualización de estos y cómo podemos mejorar el código que escribimos y que el navegador interpreta. Mucho se ha escrito y comentado en este tema sobre JavaScript, y con justa razón. Pero, ¿sabías que también puedes mejorar tu código CSS para que tome menos tiempo de carga? Ahora ya lo sabes.

Diseño de Landing Pages, Versión psicológica

Una buena landing page tiene que ver poco con el lado estético y todo con el lado de motivación. Y es por eso que con este artículo te compartimos las razones psicológicas de porque una Landing Page vende o convierte. Después de esto, vas a querer venderle Landings a cualquier cliente.

Reglas básicas de UI que todo frontendero debería saber

Hay muchas reglas en diseño de interfaces y experiencia de usuario. Pero si comienzas a entender los fundamentos de espaciado, tipografías, colores y contraste y otros conceptos parecidos, vas a tener las de ganar, no solo al momento de estar maquetando, sino al momento de proponer soluciones.

HERRAMIENTA 🛠️ 
React Chrono

¿Estas haciendo un sitio web para una empresa con Historia? De esas empresas que fueron fundadas hace más de 20 años y tienen varios sucesos importantes… Casi seguro que te pedirán un timeline, no busques más y usa este en ese proyecto en particular.

EL RINCÓN DE CSS 👨‍💻 
6 snippets de CSS que deberías saber

Los siguientes, son casos comunes donde tienes que implementar algo con CSS. Míralos, practícalos y guárdalos en tus favoritos.

VIDEO 📹️ 
21 caracterÍsticas web que no estas usando aún

Este video te muestra 21 características web que puede que aun no estes usando en tu sitio web.

INSPIRACIÓN 💡 
React Graph Gallery

¿Necesitas inspiración para crear gráficas para tu sitio web? ¿O quizás una guía de cómo iniciar…? Este sitio de ejemplos con React y D3.js te enseñará.

UN DÍA COMO HOY 🗓️ 

El 10 de enero de 2000, en plena burbuja de Internet, el portal estadounidense America Online (AOL) y Time Warner, líder de los medios de comunicación tradicionales, unen fuerzas. Esta unión se considera la mayor fusión de la historia del siglo 20, valorada entonces en unos 166.000 millones de dólares (138.110 millones de euros).

VACANTE 💼 
Front End Developer / React

Ubicación: México (Remoto)
Empresa: Intersog
Requisitos: Licenciatura en Ciencias de la Computación o un campo relacionado. Más de 5 años de experiencia profesional como desarrollador front-end Competente en HTML, CSS y JavaScript. Más de 4 años de experiencia con React. Entre otros.
Beneficios: Estarás con un equipo pequeño, por lo que tus contribuciones tendrán un gran impacto. Trabajará con miembros del equipo motivados y talentosos que lo ayudarán a desarrollar sus habilidades. Oficina Remota - tú eliges el lugar donde quieres trabajar No somos estrictos con los horarios, siempre y cuando el trabajo esté hecho y usted esté disponible cuando la gente necesita conectarse.

Puedes aplicar aquí. 🤞 

RESULTADO DEL CHALLENGE DE AYER 🧐 
¡Gracias a los que contestaron el challenge de ayer! Aquí te dejamos nuestra respuesta:

function calcularDiasEntreFechas(fecha1, fecha2) {
    const MILISEGUNDOS_POR_DIA = 1000 * 60 * 60 * 24;
    
    // Calcular la diferencia en milisegundos
    const diferencia = Math.abs(fecha2 - fecha1);

    // Convertir la diferencia en días
    return Math.ceil(diferencia / MILISEGUNDOS_POR_DIA);
}

// Ejemplo de uso
const fecha1 = new Date('2021-01-01');
const fecha2 = new Date('2021-01-05');
console.log(calcularDiasEntreFechas(fecha1, fecha2)); // Debería devolver 4

• La función calcularDiasEntreFechas toma dos objetos Date, fecha1 y fecha2, como argumentos.

• MILISEGUNDOS_POR_DIA es una constante que representa el número de milisegundos en un día.

• Se calcula la diferencia en milisegundos entre las dos fechas utilizando Math.abs para asegurarse de que el resultado sea siempre positivo.

• Luego, esa diferencia se divide por MILISEGUNDOS_POR_DIA para convertir los milisegundos en días.

• Math.ceil se utiliza para redondear hacia arriba al día más cercano, asegurando que incluso las diferencias parciales de un día se cuenten como un día completo.

• Finalmente, devuelve el número de días de diferencia.

CHALLENGE DE HOY ⚔️ 
Escribe una función en JavaScript que ordene un array de objetos según el valor de una propiedad específica de esos objetos.

• La función debe aceptar un array de objetos y el nombre de una propiedad como argumentos.

• Debe devolver un nuevo array donde los objetos estén ordenados según el valor de la propiedad especificada.

• Asume que la propiedad siempre existe en todos los objetos del array y que sus valores son comparables (números, cadenas, etc.).

Ejemplo:

const personas = [
    { nombre: "Ana", edad: 23 },
    { nombre: "Juan", edad: 31 },
    { nombre: "Sofía", edad: 27 }
];

La función debería devolver un array ordenado por edad, por ejemplo.

Comparte tu respuesta en redes sociales y etiquétanos (@frontenderos), compartiremos nuestra respuesta en el issue de mañana. 😎 

Tu feedback nos ayuda a mejorar

Por favor elige una opción y dinos lo que te gustó y lo que no. Leemos todas las respuestas 👀