ngryman

v6.5.0
3.10.3
/Users/ngryman/Projects/arbre
├─┬ babel-plugin-istanbul@2.0.1
│ ├─┬ find-up@1.1.2
│ │ └─┬ pinkie-promise@2.0.1
│ │   └── pinkie@2.0.4
│ ├─┬ istanbul-lib-instrument@1.1.1
│ │ ├─┬ babel-generator@6.14.0
│ │ │ └─┬ detect-indent@3.0.1

ngryman

// Need to generate core of the benchmark dynamically to ensure
// that type feedback does not leak between individual sample runs.
var code = " /* " + (UID++)  + " */ " +  " for (var i = 0; i < N; i++) {" +
"  var obj = arr[i];" +
"  result += obj.x + obj.y + i;" +
"}" +
"return result";

ngryman

/**
 * Having a constructor tells the VM that this object as a given "shape".
 * If this shape is constant, all the code manipulating it will eventually
 * be optimized into specialized stubs. This has a HUGE performance impact
 * and that's why sometimes JavaScript can be so close to the metal.
 */
function VNode(tag, data, children) {
  this.tag = tag
  this.data = data
  this.children = children || []

ngryman

The aim of hydratation is to avoid trashing out of existing DOM rendered by SSR, but use them and attach eventual event listeners (like a regular patch pass).

Hydratation would happen at the app level and at the first render. Basically it needs a way to know that some part of the DOM tree is something to patch so it does not have to mount.

Before going on, some terminology:

• The root is the root DOM node generated by HyperApp, the toplevel DOM element.
• The host is the DOM node that will hold the root, it's currently defined as app.root.

ngryman

import { Route, RouterEvents } from './router-exts'

const TrackScreen = html`
<section class="track-screen'
  onenter=${() => console.log('enter track screen')}
  onleave=${() => console.log('leave track screen')}
></section>
`

const HomeScreen = html`

ngryman

!function(root, factory) {
  if ('function' === typeof define && define.amd)
    define('mymodule', [], function() { return (root.mymodule = factory()) })
  else if ('object' === typeof module && module.exports)
    module.exports = factory()
  else
    root.mymodule = factory()
}(this, function() {
  'use strict'

ngryman

class DropdownMenu {
  state = {
    isMenuOpened: this.props.isMenuOpened
  }

  static defaultProps = {
    togglerLabel: 'Show menu'
  }

  componentDidMount() {

ngryman

const Editor = () => {
  const update = (e, actions) => {
    // strip html and get the text only
    const source = e.target.innerText
    
    // parse text into tokens stored in `state.tokens`
    actions.parse(source)
  }
  
  // render tokens to vnodes

ngryman

/**
 * Heartbeat rhythm
 */
var heart = document.querySelector('footer span')
var heartBounds = heart.getBoundingClientRect()
var rhythm

document.body.addEventListener('mousemove', function(e) {
  var mx = e.clientX
  var my = e.clientY

ngryman

var browserify = require('browserify')
  , gulp = require('gulp')
  , gutil = require('gulp-util')
  , mocha = require('gulp-mocha')
  , source = require('vinyl-source-stream')
  , watchify = require('watchify');

var b = watchify(browserify({
  entries: ['./app/index.js'],
  debug: true