React-ace: Reducir el tamaño del paquete

Creado en 5 oct. 2017  ·  12Comentarios  ·  Fuente: securingsincity/react-ace

Analicé mi bundle.js usando webpack-bundle-analyzer y es casi la mitad del tamaño del paquete total. He probado diferentes versiones de react-ace pero todas tienen el mismo resultado

screen shot 2017-10-05 at 5 52 26 pm

¿Cómo puedo reducir el tamaño del paquete?

help wanted issue with ace

Comentario más útil

Brace representa hasta el 66% de mi compilación de SPA relativamente compleja con paquete web (create-react-app).

¿Conoce alguna forma de reducir el tamaño de brace ? ¿Hay alguna minificación agresiva que puedas aplicar? Realmente ayudaría

Todos 12 comentarios

desafortunadamente @fumblehool brace y ace son bibliotecas enormes. Me encantaría encontrar una forma de reducir el tamaño del paquete también.

Hay alguna manera de hacer esto? Me encantaría ayudarte.

Estaría abierto a cualquier ayuda. No estoy seguro de qué es lo que impulsa el tamaño además de las dependencias.

Puede dividir su paquete en rutas de nivel superior que usan react-ace.
Por ejemplo, si tiene una ruta / publicaciones / nuevo para una página, que incluye el editor, puede cargar el componente de la página de forma asincrónica con System.import.

En react-router 3 esto es posible usando getComponent prop en <Route>

Esto no resolverá el problema del enorme tamaño del as y la llave, y creo que nada lo haría, cada biblioteca wysiwyg tiene un tamaño enorme. Pero al menos su sitio web no cargará este MB adicional de datos cuando no sea necesario

Brace representa hasta el 66% de mi compilación de SPA relativamente compleja con paquete web (create-react-app).

¿Conoce alguna forma de reducir el tamaño de brace ? ¿Hay alguna minificación agresiva que puedas aplicar? Realmente ayudaría

Espero una buena respuesta a esto.

Creé una herramienta para ayudarlo a analizar los paquetes de paquetes web en busca de regresiones de tamaño e informarlos directamente a los PR de GitHub. Es gratis para código abierto, por lo que podría valer la pena echarle un vistazo y ser útil en este escenario.

https://packtracker.io

image

así que con la versión 8 de react-ace hemos eliminado el soporte para brace y solo deberíamos importar los archivos ace que absolutamente necesitas. En teoría, los tamaños de los paquetes deberían ser más pequeños, pero no lo he probado.

En realidad, no, es incluso un poco peor, ya que la llave era de 640,83 KB, mientras que las construcciones de as son de 665,48 KB.
Es enorme :/

¿Alguna idea de que podemos reducir el tamaño del paquete?

Me gustaría que se redujera el tamaño del paquete. Actualmente, estoy usando la división de código para cargar de forma diferida el componente del editor.

Me encontré con el mismo problema donde el tamaño del paquete es inaceptable para mi proyecto. Estaba probando react-syntax-highlighter porque tienen una versión _light_. Puede valer la pena investigar cómo lo manejan. Creo que el complemento Ace es en realidad mejor y esperaba que tuviera una versión ligera similar.

https://github.com/react-syntax-highlighter/react-syntax-highlighter#light -build

¿Fue útil esta página
0 / 5 - 0 calificaciones