search

laurentlb / shader-minifier

Minify and obfuscate GLSL or HLSL code
https://ctrl-alt-test.fr/minifier/
Apache License 2.0
455 stars 34 forks source link

Consider creating an NPM package #428

Open tim-we opened 6 months ago

tim-we commented 6 months ago

Hello, I guess a common use case for this tool is to minify WebGL shaders to allow WebGL web applications to load faster. I would like to use it in the production build step for a game I'm working on. Right now that requires downloading a specific version from the releases page, setting up mono and running the tool with mono. All of this is certainly possible but integrating this into the project makes the CI and the initial setup for other contributors more complicated than it needs to be. Given that you already seem to have a wasm build for the web interface it seems that it shouldn't be that hard to create a simple NPM package based on that. There are other packages providing features like minification but they don't seem to as actively maintained as this project.

laurentlb commented 6 months ago

Thanks for the feedback! I have no experience with NPM, but I can see how it would be useful.

Contributions would be welcome.

tim-we commented 6 months ago

I have some experience with NPM but none with F# and web assembly. Also at a quick glance I could not find how you build the web assembly artifact. I'm happy to help with this but I would need some guidance to how this projects build stuff works.

laurentlb commented 6 months ago
  1. Open Shader Minifier.sln in Visual Studio (I use the free Visual Studio Community 2022)
  2. Right-Click on SMBolero.Client in the solution explorer
  3. Select Publish...

It will generate a bunch of files in a directory. You can see the files here: https://ctrl-alt-test.fr/minifier/_framework/. I've zipped all the output if you want to start from there: https://ctrl-alt-test.fr/minifier/wwwroot.zip

In the Javascript console, I can run Shader Minifier using:

DotNet.invokeMethod('SMBolero.Client', 'minify', ['--format', 'text'], 'void main(){ return 1+1; }');
tim-we commented 6 months ago

Thanks, I'll see what I can do. I'm on Linux so I don't know if I can get Visual Studio to run. Perhaps it works with MonoDevelop? But I could start to create a basic package just on the files you've provided. If I manage to do that I will get back to you here. I might be able to give it a shot tomorrow evening, if not then only in like 2 weeks. So it might take a while for me to respond.

What is your process when you release a new version? Is it manually or do you have some kind of CI pipeline (does not appear that way)? Would you be fine with me publishing that NPM package or would you like to do that yourself? Its not very hard, I can provide you with instructions and all the code required or do it myself.

laurentlb commented 6 months ago

VS shouldn't be required, but I don't know the command-line (maybe dotnet publish with some arguments).

The release process is currently manual (it's a single file, so I don't mind). Once you get a package, we can discuss how to proceed. If it can be automated somehow (with GitHub actions?), that would be ideal. I don't mind if you publish the package yourself.

tim-we commented 6 months ago

A potential problem with the current wasm build is that it is intended for the browser as this blazor thing seems to be for UI stuff. I don't fully understand how the web client works but if I understand correctly its written in F# and somehow compiled to JS/WASM. I tried to dotnet-wasi-sdk which creates a standalone wasm file which can be executed with wasmtime. That actually worked, meaning I got the CLI tool to run with wasmtime. Which means I could very easily run this from within a nodejs script. I don't know how to get files into and out of that though, I only got to the help screen.

For later reference, these are the commands I have used:

cp shader-minifier-linux.fsproj shader-minifier-wasm.fsproj
dotnet add shader-minifier-wasm.fsproj package Wasi.Sdk --prerelease
dotnet build shader-minifier-wasm.fsproj
wasmtime obj/Debug/net48/dotnet-wasi-sdk/shader-minifier-wasm.wasm

So I still have to figure out how get data in and out, maybe I can find some examples. Another option would perhaps be this: https://devblogs.microsoft.com/dotnet/use-net-7-from-any-javascript-app-in-net-7/

If it can be automated somehow (with GitHub actions?), that would be ideal. I don't mind if you publish the package yourself.

I would like to automate it as much as possible. The publishing of the package on NPM has to be manual though (I think) as you need two factor auth stuff. But lets worry about that once we have a working package.