Repolode
pmndrs

pmndrs/postprocessing

Biblioteca de postprocesamiento para three.js que encadena efectos de imagen a pantalla completa, como bloom, SSAO y gradación de color, en escenas WebGL.

Estrellas
2,952
Forks
258
Issues abiertos
30
Último commit
hace 5 días

¿Qué es?

postprocessing es una biblioteca de JavaScript para añadir efectos de postprocesamiento a pantalla completa a escenas de three.js. El postprocesamiento se ejecuta después de renderizar una escena y aplica efectos en el espacio de imagen al fotograma final. La biblioteca se organiza en torno a un EffectComposer que ejecuta una secuencia de pases, con un RenderPass para dibujar la escena y un EffectPass para aplicar efectos.

EffectPass combina cualquier conjunto de efectos en la menor cantidad posible de operaciones de renderizado, de modo que se pueden combinar muchos efectos sin el costo de encadenar un pase independiente para cada uno. Cada efecto puede definir su propia función de mezcla. Las operaciones a pantalla completa usan un solo triángulo que cubre la pantalla, en lugar de un cuadrilátero. La biblioteca también admite búferes de fotograma HalfFloat de alta precisión para flujos de trabajo de tipo HDR e incluye un ToneMappingEffect para convertir colores HDR a una salida que se pueda mostrar.

El paquete incluye efectos integrados como bloom, desenfoque, profundidad de campo, glitch, rayos divinos, contorno, SSAO, pixelación, gradación de color basada en LUT y viñeta. También se pueden crear efectos y pases personalizados; la wiki del proyecto documenta el proceso.

Funciones clave

  • 01Combina muchos efectos en un solo EffectPass para reducir las operaciones de renderizado.
  • 02Incluye efectos integrados como bloom, SSAO, profundidad de campo, contorno y gradación de color.
  • 03Admite funciones de mezcla por efecto.
  • 04Ofrece búferes de fotograma HalfFloat de alta precisión para renderizado de tipo HDR.
  • 05Incluye un ToneMappingEffect para convertir de HDR a LDR.
  • 06Permite crear efectos y pases personalizados.

Casos de uso

  • Añadir bloom o resplandor a la visualización de un producto o a una escena de juego en three.js.
  • Aplicar estilos retro, como líneas de escaneo, pixelación o glitch, a una escena WebGL.
  • Aplicar gradación de color a una escena 3D mediante archivos LUT.
  • Crear efectos interactivos, como ondas de choque o contornos en objetos seleccionados.

Temas

#threejs#webgl#post-processing#graphics#shaders#real-time#image-effects#2d-filter-effects#composer#effects

Preguntas frecuentes

¿Qué es postprocessing?
Biblioteca de postprocesamiento para three.js que encadena efectos de imagen a pantalla completa, como bloom, SSAO y gradación de color, en escenas WebGL. postprocessing es una biblioteca de JavaScript para añadir efectos de postprocesamiento a pantalla completa a escenas de three.js. El postprocesamiento se ejecuta después de renderizar una escena y aplica efectos en el espacio de imagen al fotograma final. La biblioteca se organiza en torno a un EffectComposer que ejecuta una secuencia de pases, con un RenderPass para dibujar la escena y un EffectPass para aplicar efectos.
¿postprocessing es gratuito? ¿Qué licencia tiene?
postprocessing es open source bajo la licencia Zlib. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿postprocessing sigue mantenido?
Mantenimiento activo. El último commit de postprocessing fue el 1 nov 2026.
¿Para qué puedo usar postprocessing?
Añadir bloom o resplandor a la visualización de un producto o a una escena de juego en three.js. Aplicar estilos retro, como líneas de escaneo, pixelación o glitch, a una escena WebGL. Aplicar gradación de color a una escena 3D mediante archivos LUT. Crear efectos interactivos, como ondas de choque o contornos en objetos seleccionados.
¿Dónde consigo postprocessing?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/pmndrs/postprocessing

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados