Estoy usando el jQuery selector de Fecha, pero es demasiado pesado, el record de la versión de ui.datepicker.min.js es de 44 KB. Las imágenes de datepicker tienen su propio peso. El framework jQuery es de 59 KB. Y el total de las imágenes en la página son alrededor de 80 KB. El total de HTML de la página es de alrededor de 70 KB y el tamaño de archivo CSS es de alrededor de 72 KB. Y mucho más, y todas las cosas que agregar hasta 600 KB (0.6 MB).

¿Crees que el usuario espere a 600 KB para ser descargado en el navegador? Puede tomar hasta 8 – 10 segundos. Y no creo que el usuario va a esperar por un largo tiempo.

Quiero mantener mi sitio web ligero. ¿Hay algún ligero selector de fecha JavaScript?

  • Usted no cuenta con la compresión gzip durante la transferencia. jquery se convierte en 23KB por ejemplo. +1 para la pregunta, sin embargo, me gustaría sustituir datepicker demasiado (no incluso el apoyo de CSS sprites!)
  • No puedo contar que ya estoy usando microsoft cdn para servir de jquery y no es gzip.
  • Por supuesto que es gzip, no has mirado los encabezados: Content-Encoding: gzip. Ni siquiera puedo imaginar a alguien llamando a un CDN si no funciona los más básicos de la optimización de los recursos estáticos.
  • A menos que usted necesita para mostrar el selector de fecha inmediatamente cuando la página se carga, la carga en el fondo. El usuario puede nunca aviso si se lleva a 0.8 segundos o 8 segundos, si no utilizar el selector de fecha de control de inmediato.
  • Me encantaría ver una respuesta a esta pregunta. El funcionario ejemplo Jquery selector de fecha página me muestra 21 solicitudes http y 200k de datos sólo para los huesos descubiertos selector de fecha y YSlow le da un D. jqueryui.com/demos/datepicker/default.html que me Estoy perdiendo algo aquí?
InformationsquelleAutor Zain Shaikh | 2010-03-27

7 Comentarios

  1. 2

    Una opción es utilizar un red de entrega de contenido (CDN), tales como la Bibliotecas de Google API para servir común de archivos de secuencia de comandos como jQuery. El uso de un CDN son las posibilidades de que los usuarios ya tienen el archivo de secuencia de comandos en la caché de su navegador y que no tendrás que descargar de nuevo. Como para los otros recursos estáticos usted puede leer YSlow recomendaciones para la optimización de los tiempos de carga de los recursos estáticos (puede minify, gzip comprime y caché de los recursos estáticos).

    • Ya estoy utilizando microsoft cdn para servir jquery (weblogs.asp.net/scottgu/archive/2009/09/15/…) marco. y también he implementado la mayoría de las reglas de YSlow. pero usted sabe, sitio web Interactivo que siempre perjudica el rendimiento del sitio web. Estoy tratando de optimizar tanto como sea posible. sólo hay un campo en la página donde tengo que mostrar el calendario. y añade 44 KB para Jquery datepicker. 🙁
    • jqueryui que contiene datepicker ya está alojado en google CDN. Y por cierto, no es 44KB, es 12KB cuando gzip.
    • A partir de ahora el jqueryui ha crecido a 58KB Gzip y 223KB sin comprimir, puede ser vale la pena conocer.
  2. 68

    Me encontré con Pikaday, que se ve bien y es bastante ligero (alrededor de 11kb de JS, record). No requiere jQuery bien.

    Aquí un demo.

    Una captura de pantalla del selector:

    ¿Hay algún ligero selector de fecha JavaScript?

    Ejemplo de uso de pikaday con timepicker y moment.js

    <link rel="stylesheet" href="/pikaday/css/pikaday.css">
    <script src="/pikaday/moment.js"></script>
    <script src="/pikaday/pikaday.js"></script>
    <script>
    var timepicker = new Pikaday({
        field: document.getElementById('datetimepicker'),
        firstDay: 1,
        minDate: new Date(2016, 0, 1),
        maxDate: new Date(2100, 12, 31),
        yearRange: [2016,2100],
        showTime: true,
        autoClose: false,
        use24hour: false,
        format: 'MMM Do YYYY, h:mm a'
    });
    </script>

    github.com/owenmead/Pikaday

    momentjs.com

  3. 6

    Me enfrentó el mismo problema con el oficial de jQuery ejemplo (ver mi comentario anterior). He aislado el problema a temas CSS y comenzó la remoción de basura. Antes de terminar me encontré con un hombre que había hecho exactamente lo que yo necesitaba: http://keith-wood.name/datepickBasics.html

    Es necesario DatePicker.js y un solo archivo CSS. Todo sea dicho, 2 solicitudes HTTP y 40 kB además de los básicos de jQuery archivo todo el mundo debería tener en caché como dice Darin.

    • el enlace ya no funciona
  4. 1

    La interfaz de usuario está dirigido principalmente a los dispositivos táctiles, pero el uso del escritorio está bien así.
    Respecto al peso, record y en formato gzip, se trata de un aceptable 15kb.

    Mobiscroll Calendario

Dejar respuesta

Please enter your comment!
Please enter your name here