Research
Security News
Malicious npm Package Targets Solana Developers and Hijacks Funds
A malicious npm package targets Solana developers, rerouting funds in 2% of transactions to a hardcoded address.
This module is bloated and a little too magical. Instead, some of the following are recommended:
The Easy Bake Oven of canvas rendering. Sets up a canvas for 2D or WebGL context, handling a few things like:
Simplest use might look like this:
//a simple render loop
function render(context, width, height, dt) {
context.clearRect(0, 0, width, height);
context.fillRect(20, 50, 25, 25);
context.fillText("FPS: "+this.fps, 20, 20);
}
//defaults to a full-screen canvas
var app = require('canvas-app')(render);
//append to DOM
document.body.appendChild( app.canvas );
//start render loop
app.start();
For simple use like the above, you may want to use canvas-testbed, which also handles DOM ready event, better body styling for full-screen canvas apps, and requestAnimationFrame polyfills.
Another example:
var app = require('canvas-app')(renderHandler, {
width: 256,
height: 256,
once: true, //only render once
retina: false, //don't try to scale for retina displays
});
//renders a single frame
app.renderOnce();
The constructor can take two forms:
canvasApp(renderHandler, options);
canvasApp(options);
width
force a width of the canvas in pixels. If passed, resize events will be ignoredheight
force a height of the canvas in pixels. If passed, resize events will be ignoredignoreResize
if true, resize events will be ignoredretina
default true, whether to scale the canvas style and context for device pixel ratioonce
only renders a single frame, and then again on resizecanvas
the canvas element to use, otherwise creates a new elementcontext
the context to use, can be either 'webgl' or '2d', defaults to 2dcontextAttributes
passed to the getContext callonResize
a function called on resize with arguments width, height
onRender
a function called on render with arguments context, width, height, deltaTime
(can instead be passed as first argument to the constructor)resizeDebounce
if we are using built-in resize handlers, they will be debounced by 50 ms unless you specify a value explicitly hereIf context is a WebGLRenderingContext or CanvasRenderingContext, it will be used along with its associated
canvas. This is useful to avoid consecutive
getContext('webgl')` calls which can interfere with WebGL inspectors.
renderOnce()
renders a single framestart()
starts the render loopstop()
stops the current render loopresize(width, height)
resizes the canvas to the given size. You should probably use ignoreResize
if you want to manually handle resize events.canvas
the canvas elementcontext
the 2D or WebGL rendering contextwidth
, height
the current size, not scaled by devicePixelRatiorunning
whether the loop is currently runningdeviceWidth
, deviceHeight
the actual device height (i.e. size * devicePixelRatio). This is needed for glViewport, glScissor, etc.For 2D contexts, scale()
is called before rendering based on the deviePixelRatio. For WebGL contexts, gl.viewport()
is called before rendering with the device size.
If retina
is false, the device size will be assumed to be the same as the canvas size.
MIT, see LICENSE.md for details.
FAQs
sets up a retina-scaled canvas with render loop
We found that canvas-app demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
A malicious npm package targets Solana developers, rerouting funds in 2% of transactions to a hardcoded address.
Security News
Research
Socket researchers have discovered malicious npm packages targeting crypto developers, stealing credentials and wallet data using spyware delivered through typosquats of popular cryptographic libraries.
Security News
Socket's package search now displays weekly downloads for npm packages, helping developers quickly assess popularity and make more informed decisions.