nanocomponent - npm Package Compare versions

Comparing version 1.1.2 to 2.0.0

index.js

@@ -6,3 +6,2 @@ var observeResize = require('observe-resize')
 var assert = require('assert')
-var isDom = require('is-dom')
 var html = require('bel')
@@ -15,7 +14,3 @@
 function nanocomponent (val) {
-  assert.ok(isDom(val) || (typeof val === 'object') || typeof val === 'function', 'nanocomponent: val should be a valid DOM node, type Object or type Function')
-
-  if (isDom(val)) return createStaticElement(val)
-  if (typeof val === 'function') return createDynamicElement(val)
-
+  assert.equal(typeof val, 'object', 'nanocomponent: val should type function')
   assert.equal(typeof val.render, 'function', 'nanocomponent: needs a .render function')
@@ -27,2 +22,3 @@
   var onenterHandler = val.onenter
+  var updateHandler = val.onupdate
   var onexitHandler = val.onexit
@@ -37,11 +33,7 @@ var onloadHandler = val.onload
 
-  if (isDom(val)) return createStaticElement(val)
-  else if (typeof val === 'function') return createDynamicElement(val)
-  else {
-    if (onresizeHandler) applyResize()
-    if (onenterHandler || onexitHandler) applyOnintersect()
-    applyOnloadhandler()
-    if (placeholderHandler) applyPlaceholder()
-    return renderHandler
-  }
+  if (onresizeHandler) applyResize()
+  if (onenterHandler || onexitHandler) applyOnintersect()
+  applyOnloadhandler()
+  if (placeholderHandler) applyPlaceholder()
+  return renderHandler
 
@@ -52,3 +44,3 @@ function applyOnloadhandler () {
     createOnload()
-    renderHandler = createDynamicElement(_render, onloadHandler, onunloadHandler)
+    renderHandler = createElement(_render, updateHandler, onloadHandler, onunloadHandler)
   }
@@ -106,34 +98,6 @@
 
-function createStaticElement (element) {
+function createElement (render, update, _onload, _onunload) {
   var isRendered = false
+  var isMounted = false
   var isProxied = false
-  var proxy = null
-
-  onload(element, handleLoad, handleUnload)
-
-  return function render () {
-    if (!isRendered) {
-      return element
-    } else if (!isProxied) {
-      proxy = html`<div></div>`
-      proxy.isSameNode = function (el) {
-        return (el === element)
-      }
-    }
-    return proxy
-  }
-
-  function handleLoad () {
-    isRendered = true
-  }
-
-  function handleUnload () {
-    isProxied = false
-    proxy = null
-  }
-}
-
-function createDynamicElement (render, _onload, _onunload) {
-  var isRendered = false
-  var isProxied = false
   var element = null
@@ -150,26 +114,29 @@ var proxy = null
     if (!isRendered) {
+      isRendered = true
       args = _args
       element = render.apply(render, args)
       onload(element, handleLoad, handleUnload)
-      return element
-    } else {
-      if (!compare(_args, args)) {
-        args = _args
-        element = render.apply(render, args)
-        onload(element, handleLoad, handleUnload)
-        return element
-      } else if (!isProxied) {
-        proxy = html`<div></div>`
-        proxy.isSameNode = function (el) {
-          return (el === element)
-        }
-        return proxy
-      } else {
-        return proxy
+    }
+
+    if (!isMounted) return element
+    if (!compare(_args, args)) {
+      args = _args
+      if (update) {
+        // call update with element as the first arg
+        update.apply(render, args.slice(0).unshift(element))
       }
     }
+
+    if (!isProxied) {
+      proxy = html`<div></div>`
+      proxy.isSameNode = function (el) {
+        return (el === element)
+      }
+    }
+
+    return proxy
   }
 
   function handleLoad (el) {
-    isRendered = true
+    isMounted = true
     if (_onload) _onload(el)
@@ -179,2 +146,3 @@ }
   function handleUnload (el) {
+    isMounted = false
     isProxied = false
@@ -181,0 +149,0 @@ proxy = null

package.json

 {
   "name": "nanocomponent",
-  "version": "1.1.2",
+  "version": "2.0.0",
   "description": "Create performant HTML elements",
@@ -26,3 +26,2 @@ "main": "index.js",
   "dependencies": {
-    "is-dom": "^1.0.6",
     "observe-resize": "^1.1.0",
@@ -29,0 +28,0 @@ "on-intersect": "^1.1.0",

README.md

@@ -15,26 +15,2 @@ # nanocomponent [![stability][0]][1]
 ## Usage
-### Cache a static HTML element
-```js
-var component = require('nanocomponent')
-var html = require('bel')
-
-var staticElement = component(html`
-  <div>heya</div>
-`)
-var el = staticElement()
-console.log(el)
-```
-
-### Cache a dynamic HTML element
-```js
-var cachedElement = component(function (foo) {
-  return html`
-    <div>${foo}</div>
-  `
-})
-console.log(cachedElement('hey folks'))   // render
-console.log(cachedElement('hey folks'))   // return cached element
-console.log(cachedElement('hey humans'))  // render again
-```
-
 ### Defer rendering until the browser has spare time available
@@ -126,12 +102,4 @@ ```js
 ### render = nanocomponent(HtmlOrFunctionOrObject)
-Create a render function for a component based depending on the arguments that
-are passed in:
-- __HTMLElement:__ cache the result of the function until it's removed from the
-    DOM
-- __function:__ cache the result of the function until new arguments are passed
-    or it's removed from the DOM
-- __object:__ create an object with different methods attached. Cached until
-    new arguments are passed in or when it's removed from the DOM
-
-When passing an object, the availble methods are:
+Create an object with different methods attached. Cached until new arguments
+are passed in or when it's removed from the DOM. Availble methods are:
 - __render(...args):__ (required) Render DOM elements.
@@ -138,0 +106,0 @@ - __placeholder(..args)__ Render DOM elements and delegate the `render` call to

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Dependency count

5

decreased by-16.67%

Worsened metrics

Total package byte prevSize

18653

decreased by-8.37%

Lines of code

214

decreased by-11.57%

Number of lines in readme file

258

decreased by-11.03%

Dependency changes

• - Removedis-dom@^1.0.6