Skip to main content
100%

JavaScript tips

✓ Published0🌍 Public
Aabernier
Last edited Nov 14, 2019
Created on Sep 6, 2013

This animated slideshow presents JavaScript coding tips and techniques, covering ES6 modules, destructuring, monkey patching, node.js binary scripts, and animation patterns. The code examples demonstrate practical implementations using TweenMax for timeline-based animations, including a draw/anim pattern and a 1-second reference scaling approach. It also showcases event handling for CSS transitions and transform property detection. The rendering uses code blocks with syntax highlighting, and the animation presents each tip sequentially, with the source gist serving as the data for the displayed content.

AI-generated description

Similar vizzes

Loading thumbnail…

JS tips

This example demonstrates common JavaScript programming patterns and techniques through concise code snippets. It covers assignment shortcuts, existential checks, JSONP implementation with jQuery’s `getJSON`, a polyfill for `Object.create`, function proxying, reserved words, and the `array.indexOf` method. The code is presented as a gist, showing practical APIs like `Object.create`, `func.apply`, and `Array.indexOf`, with comments explaining each pattern and equivalent syntax in CoffeeScript.

Aabernier
71% match
Loading thumbnail…

Complete Node.js CheatSheet --> UPDATED VERSION --> https://github.com/LeCoupa/awesome-cheatsheets

This animated visualization presents a comprehensive Node.js cheat sheet, displaying code sections for global objects, console methods, timers, modules, and process APIs. The code scrolls through a JavaScript file that documents key functions and syntax examples, with the source pulled from a gist by Kirun1. The animation renders text sequentially, highlighting different API categories as the cheat sheet moves vertically, making the reference material visually engaging and easy to follow.

KKirun1
70% match
Loading thumbnail…

JavaScript Basics

This example demonstrates the foundational syntax and core concepts of JavaScript through a series of commented-out code snippets. It shows variable declarations, arithmetic operations, control flow with loops, and function definitions, including ES6 arrow functions. The visualization uses a simple SVG canvas with a script tag, and the code is written directly within an HTML file. It covers object literals and constructor functions, illustrating how to create and manipulate objects. The rendering is achieved through the SVG API, and the file includes no external libraries, relying solely on native JavaScript.

Aandu006@gmail.com
70% match
Loading thumbnail…

Gist c53b34b249207da31466

This animated visualization is a Node.js cheat sheet that displays API documentation in a dynamic, moving format. The code covers fundamental Node.js concepts including global objects, console methods, timers, modules, and process handling. It demonstrates the use of the http module to create a web server and various event-driven programming techniques. The animation renders the documentation in a visually engaging way, showcasing both the syntax and usage of core Node.js APIs.

SSwampGuzzler
70% match
Loading thumbnail…

JavaScript Basics

This example demonstrates fundamental JavaScript syntax and programming concepts through a series of commented-out code snippets, from console logging and variable assignment to objects, loops, and arrow functions. The page renders an empty SVG canvas with dimensions 960 by 500 pixels, serving as a static backdrop for the educational content. Because all code examples are commented out, no visual output is generated, and the focus remains on the structure and semantics of each JavaScript construct.

CCurran Kelleher
69% match
Loading thumbnail…

Making Javascript faster

This example presents a markdown document that compiles performance guidelines for JavaScript, sourced from a gist by GerHobbelt and linked to jsPerf benchmarks. The text explains optimization techniques such as using IIFEs over nested functions, avoiding the `arguments` object, and preferring `that` instead of `bind`. It describes the content without a graphical interface, serving as a static textual reference for developers.

GGerHobbelt
68% match
Loading thumbnail…

Javascript 101

This example presents a static SVG bar chart titled "Javascript 101," rendered with a single white bar outlined in black. It primarily serves as a canvas for commented JavaScript code snippets that demonstrate core programming concepts, including function definitions, object creation, array manipulation with `map` and `splice`, and a simple data storage system using `updateLevelData` and `getLevelData`. The visualization shows how text and basic shapes can be combined with code annotations, using a fixed 960x500 SVG canvas and styled text at 72px.

KKhanin Sisaengsuwanchai
67% match
Loading thumbnail…

JavaScript Basics

This example illustrates fundamental JavaScript programming concepts through a blank SVG canvas. The page embeds commented-out code covering variables, objects, functions, and loops, demonstrating basic syntax before execution. Using an HTML document with inline JavaScript, it sets up an SVG element measuring 960 by 500 pixels. The visualization serves as an educational template for learning language basics, with all example code commented out, preparing developers to uncomment and run statements incrementally. It relies on vanilla JavaScript and inline SVG rendering rather than external libraries, highlighting core web development principles.

Eelgato_1994
67% match