I have read this answer several time over the course of several weeks and its a good crash course in the relevant topics, and some of the learnings are applicable to my use case but I am not concerned with displays or physical device screen size.

In my use case a user is uploading a .png file, and prior to storing or making any backend calls I want to validate that it meets the minimum PPI requirement.

Currently the formula I am using is pretty simple, the know hypotenuse of the print area is 20 inches, then take the width and height of the image to calculate it's diagonal distance in pixels, then divide that by 20 to get the PPI. From my understanding this should work for my purposes; in most cases. Please correct me if this assumption is wrong.

The issue I need help with solving for is the fact that .png files allow for transparent pixels, which introduces the issue of having to alter my formula to calculate both height and width by finding the distance between the first and last non-transparent pixel on both respective axes.

I was wondering if there is a react or javascript library that would aid in doing this kind of introspection, or if I am forced to build some backend service that does this kind analysis using image magic or something similar. I would like to avoid a round trip to the API, but I understand if this kind of analysis is so resource intensive that it would make more since to do it on the backend.

I would also be open to alternative solutions.