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 🙏

© 2025 – Pkg Stats / Ryan Hefner

gridsjs

v1.0.1

Published

GridsJS is an easy and intuitive JavaScript library for creating, manipulating, and rendering 2D grids. Perfect for games, simulations, and any grid-based applications, it handles all the math for you. made with <3 by me!

Downloads

181

Readme

GridsJS 🚀

Create grid-based systems with ease!
GridsJS saves you time by giving you a simple, intuitive way to work with 2D grids. It’s versatile enough to build games, simulations, or any grid-based system you can imagine.


Features ✨

  • Create grid-based systems quickly
  • Save time—no need to code your own grid engine
  • Versatile for games, systems, simulations, and more
  • Easy-to-use API for setting, getting, filling, and rendering grids

Installation 💾

Install via npm:

npm install gridsjs

And then in your JS file:

const grids = require('gridsjs');

Getting Started 🚀

Initializing a Grid

// Initialize a 10x10 grid
grids.initGrid(10, 10);
  • x = width
  • y = height

Setting and Getting Values

// Set a value at x=3, y=5
grids.SetGridValue(3, 5, 1);

// Get a value at x=3, y=5
const value = grids.GetGridValue(3, 5);
console.log(value); // 1

Fill the Grid

// Fill the entire grid with 0s
grids.FillAllGrids(0);

Render the Grid

grids.RenderGrid();

Output will display the grid in the console with each cell’s value.


Example: Conway's Game of Life 🌱

const grids = require('../index');

const WIDTH = 10;
const HEIGHT = 10;

// Initialize grid
grids.initGrid(WIDTH, HEIGHT);

// Randomly populate grid (30% chance alive)
for (let y = 0; y < HEIGHT; y++) {
    for (let x = 0; x < WIDTH; x++) {
        grids.SetGridValue(x, y, Math.random() < 0.3 ? 1 : 0);
    }
}

// Render function
function RenderGridCustom() {
    let output = '';
    for (let y = 0; y < HEIGHT; y++) {
        for (let x = 0; x < WIDTH; x++) {
            output += grids.GetGridValue(x, y) === 1 ? 'O ' : '. ';
        }
        output += '\n';
    }
    console.clear();
    console.log(output);
}

// Count alive neighbors
function countAliveNeighbors(x, y) {
    let count = 0;
    for (let dy = -1; dy <= 1; dy++) {
        for (let dx = -1; dx <= 1; dx++) {
            if (dx === 0 && dy === 0) continue;
            const nx = x + dx;
            const ny = y + dy;
            if (nx >= 0 && nx < WIDTH && ny >= 0 && ny < HEIGHT) {
                count += grids.GetGridValue(nx, ny);
            }
        }
    }
    return count;
}

// Next generation
function nextGeneration() {
    const newGrid = [];
    for (let y = 0; y < HEIGHT; y++) {
        for (let x = 0; x < WIDTH; x++) {
            const alive = grids.GetGridValue(x, y);
            const neighbors = countAliveNeighbors(x, y);
            let newState = alive;
            if (alive === 1 && (neighbors < 2 || neighbors > 3)) newState = 0;
            if (alive === 0 && neighbors === 3) newState = 1;
            newGrid.push(newState);
        }
    }
    for (let i = 0; i < newGrid.length; i++) grids.SetRawGridValue(i, newGrid[i]);
}

// Animation loop: 1 second per generation
setInterval(() => {
    RenderGridCustom();
    nextGeneration();
}, 1000);

You can then build animations, simulations, or any grid-based logic using the simple API provided.


API Reference 📚

  • initGrid(width, height) – initialize a grid
  • SetGridValue(x, y, value) – set a cell value
  • GetGridValue(x, y) – get a cell value
  • SetRawGridValue(index, value) – set cell by raw index
  • GetRawGridValue(index) – get cell by raw index
  • FillAllGrids(value) – fill entire grid
  • RenderGrid() – print the grid to console

Contributing 🤝

Feel free to open issues or submit pull requests. Everyone is welcome!


License 📝

MIT

thank you for downloading! <3