Glsl-reports NPM

glsl-reports

javascript micro-library which provides a graphical interface to display the logs of your shaders using shadow dom 🗒️

Problem❓

Debugging in glsl can be very difficult. we are spit in the mouth a long error that we must consult in the console. often the line indicated concerning the error is not the correct one. in addition to error, we balance the source code of the shader with. I let you imagine the horror in console when a very long shader script spits out several errors. not easy to really capture what is going on.

Solution❓

glsl-reports will allow you to have a graphical interface with which you will receive error logs from your shaders. thanks to this user interface you will be able to filter your errors, use the dark theme mode (effi-class if you are a shadow coder) and many other things that will happen as I develop on this project.

⚠️ Disclaimer

i'm not a developer, i'm just a local guy who carries programming in his heart with the desire to learn more about the creation of development tools. this project is trying to follow in the footsteps of our safe guy @spite. well, i have slightly customized it so that you can have a workspace that is both visual but also functional. you will thank me later.

🛠️ Features

🎉 ui interface for error handling: filter, theme, total number of errors rescended.
🌐 web component using the shadow dom.

🖍 Theme

📦 Install dependencies

Command line

npm i glsl-reports

yarn add glsl-reports

Download

you can download the repo, then you copy the file dist/glsl-reports.js and place it in the desired location in your application.

🚀 Start project

ok but how does your gadget work?

<script src="./glsl-reports.js"></script>

import 'glsl-reports';

voilà ! it's finished, glsl-reports is perfectly installed. skurt skurt! to be sure that you did well. create an error in your script and you should see an error appear through your new error interface.