npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

pw2

v1.0.1

Published

Automatically re-scale your images for the right power of two dimensions

Downloads

7

Readme

⚡ PW²

Installation

npm i pw2

Backend Usage

Combine ⚡PW² with fs and resize your textures with only 8 lines of code.

const fs = require('fs')
const {createPw2, RESIZING_MODES} = require('pw2')
const  pw2 = createPw2()
 
async function main(inputPath) {
	const inputFile = await fs.readFileSync(inputPath)
	const nearestBuffer = await pw2.resizeAndGetBuffer(inputFile, RESIZING_MODES.NEAREST_PW2)
	fs.writeFileSync('./nearest.png', nearestBuffer)
}

FrontEnd Usage

Hook the handleFileUpload function to your file input 'change' event, and use file-saver to download the blob easilly.

import {saveAs} from 'file-saver'
import {createPw2, RESIZING_MODES} from 'pw2'
const  pw2 = createPw2()

async function handleFileUpload(evt) {
	const file = evt.target.files[0]
	const fileReader = new  FileReader()

	fileReader.onload = async() => {
		const resizedFile = await pw2.resizeAndGetBuffer(fileReader.result, RESIZING_MODES.NEAREST_PW2)
		const resizedFileBlob = new Blob([resizedFile])
		saveAs(resizedFileBlob, 'resized_image.png')
	}

	fileReader.readAsArrayBuffer(file)
}

But Why ?

Games and real-time applications, in general, tend to prefer images and textures with power-of-two dimensions, because they make it easier to generate mipmaps, consume less GPU memory, and increase the overall performance for shader operations.

However, finding the right power-of-two values for each dimension of each texture of each model in your application sounds time-consuming, and it is. ⚡PW² born from the necessity to make this a no-brainer, quick and easy process.

⚡PW² uses Jimp under the hood to get your texture current dimensions and re-scale it to the right power-of-two dimensions.

This library was developed for the cs50 Final Project assignment.

License

MIT

TODO

  • Fix PREVIOUS_PW2 enum value to PREVIOUS_PW2 on src/resizingModes.ts
  • Fix Ipw2 Interface methods to accept Pw2AllowedInputs as type to file input on src/pw2.ts
  • Export Ipw2 Interface to external use on src/pw2.ts and src/index.ts
  • Fix any English misspells (sorry guys, it's not my first language 🤷‍♂️)