Hugo Future Imperfect Slim

Tracey Jaquith 路 PoohBot Pictures

Technophile 路 Optimist 路 CyclistArchivist 路 Design 路 Video 路 TV 路 Kubernetes 路 Docker

2 minutes read

image credit: Lin Clark @linclark - article link included below
things turning me on this week
鈽昬njoy with a hot cupa java/script
JavaScript got all growed up since it begun, when “ES6” hit the scenes (now present it just about every browser and mobile setup at this point aside from MSIE). You can finally do sane things like class Foo { .. } similar to other languages, and the dreaded this “stealing” is finally sane with “fat arrow” functions like const myfunc = (arg1, arg2) => { console.log({ arg1, arg2 }) }. Pentultimately, javascript template strings are amazing and get us all out of the quoting and multi-line h*ll we’ve been dealing with for decades. Lastly, throw in ‘ES Modules’ and you get a #1 world-class code including/importing system that handles optimizing across server <=> client boundaries.

ES6 Examples

ES6 is a major update to JavaScript that fixes sooo many things.

Among other things:

  • We get real class definitions.
  • We get real constructor() methods.
  • const and let make variables safer and much easier to maintain.
  • We can use static methods (class methods callable without instantiating/constructing objects)
  • We get multi-line ‘template strings’ that can have JS code inside ${ .. } blocks. Brilliant!

class Adder {
  constructor(arg) {
    this.arg = arg
  }
  render() {
    return `
<div class="something">
  You said: ${this.arg}
</div>`
  }

  static add(x, y) {
    return x + y
  }
}

Some simple calls:

Adder.add(3, 10)

=> 13

const math = new Adder(17)
math.render()
<div class="something">
  You said: 17
</div>"

ES Modules

The article below, I’ve pored over at least 3x over last year or so. It’s always a treat, and showcases just how good and amazing ES Modules really are. To wit nodeJS is migrating to ES Modules instead of commonJS.

Basically, you can have JS code that imports other JS code (across the web) efficiently. Like best-in-class code/package managers, even circular dependencies are no problem. It works via 3 stages:

  • [load] quick parse (but don’t execute) found lists of (included) .js files to find other .js files that are, in turn, import-ed. Load .js files in parallel (and over binary/compressed HTTP/2 connections, ideally). Make “variable slots” that connect import .. from .. statements with imported/included files.
  • [instantiate] setup all the “slots” - connecting imported/included code with the names used in the including code.
  • [evaluate] excecute all the JS code, filling in the “slots” with values and evaluated code.

Check out Lin Clark’s excellent overview of ES Modules

Say something

Comments

Nothing yet.

Recent posts

See more

Categories

Tags

#spottheshuttle 1940s 1st-person 3d accident aids-lifecycle animals apple-watch architecture arkit art ascii-art asia augmented-reality bali bay-area biking cafe-racer camaro camera-video cars cat-pee cat-psychology cats coding college colorspaces computer-vision cornell css dark-mode decaf deinterlace design diy documentary ducting emacs endeavour family ffmpeg games geek golden-gate-bridge google-cardboard green-magic-man h.264 hack highway-1 home hugo hyperlapse internet-archive ios iphone javascript kubernetes landscapes linux lisp luke-battling-darth mac macosx mashup metal montclair motion-jpeg motorcycle mplayer nasa new-bay-bridge news ninja oakland partioning php php-htm-mode politics protest recording remaster remix remodel shuttle small-town star-wars swift technical time-lapse time-machine timing-belt-adjustment top-end-rebuild tracey training-ride vacation valve-job video virtual-reality vlog weekend-mechanic work x264 xcode yuvj420p zx6

About

tracey is a nonstop dance party. so you dont have to. dont ask me about k8s. thanks for dropping by today. you look nice.