Skip to content

Instantly share code, notes, and snippets.

@mbostock
Last active August 7, 2020 22:45
Show Gist options
  • Save mbostock/bb09af4c39c79cffcde4 to your computer and use it in GitHub Desktop.
Save mbostock/bb09af4c39c79cffcde4 to your computer and use it in GitHub Desktop.
D3 Custom Bundle
license: gpl-3.0
.DS_Store
node_modules
npm-debug.log
d3.js

This is a demonstration of building a custom D3 4.0 bundle using ES2015 modules and Rollup. Custom bundles can be optimized to contain only the code you need. This example exposes just three fields on the d3 object: d3.event, d3.select and d3.selectAll. The minified and gzipped bundle is only 3,691 bytes, a savings of 93% over the default build!

To build:

npm install
npm run prepublish

You may also run Rollup and UglifyJS directly:

rollup -c && uglifyjs d3.js -c -m -o d3.min.js
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n(t.d3=t.d3||{})}(this,function(t){"use strict";function n(t){return function(){var n=this.ownerDocument,e=this.namespaceURI;return e===K&&n.documentElement.namespaceURI===K?n.createElement(t):n.createElementNS(e,t)}}function e(t){return function(){return this.ownerDocument.createElementNS(t.space,t.local)}}function r(t,n,e){return t=i(t,n,e),function(n){var e=n.relatedTarget;e&&(e===this||8&e.compareDocumentPosition(this))||t.call(this,n)}}function i(n,e,r){return function(i){var o=t.event;t.event=i;try{n.call(this,this.__data__,e,r)}finally{t.event=o}}}function o(t){return t.trim().split(/^|\s+/).map(function(t){var n="",e=t.indexOf(".");return e>=0&&(n=t.slice(e+1),t=t.slice(0,e)),{type:t,name:n}})}function u(t){return function(){var n=this.__on;if(n){for(var e,r=0,i=-1,o=n.length;r<o;++r)e=n[r],t.type&&e.type!==t.type||e.name!==t.name?n[++i]=e:this.removeEventListener(e.type,e.listener,e.capture);++i?n.length=i:delete this.__on}}}function s(t,n,e){var o=rt.hasOwnProperty(t.type)?r:i;return function(r,i,u){var s,a=this.__on,c=o(n,i,u);if(a)for(var l=0,f=a.length;l<f;++l)if((s=a[l]).type===t.type&&s.name===t.name)return this.removeEventListener(s.type,s.listener,s.capture),this.addEventListener(s.type,s.listener=c,s.capture=e),void(s.value=n);this.addEventListener(t.type,c,e),s={type:t.type,name:t.name,value:n,listener:c,capture:e},a?a.push(s):this.__on=[s]}}function a(){}function c(){return[]}function l(t,n){this.ownerDocument=t.ownerDocument,this.namespaceURI=t.namespaceURI,this._next=null,this._parent=t,this.__data__=n}function f(t,n,e,r,i,o){for(var u,s=0,a=n.length,c=o.length;s<c;++s)(u=n[s])?(u.__data__=o[s],r[s]=u):e[s]=new l(t,o[s]);for(;s<a;++s)(u=n[s])&&(i[s]=u)}function h(t,n,e,r,i,o,u){var s,a,c,f={},h=n.length,p=o.length,_=new Array(h);for(s=0;s<h;++s)(a=n[s])&&(_[s]=c=_t+u.call(a,a.__data__,s,n),c in f?i[s]=a:f[c]=a);for(s=0;s<p;++s)c=_t+u.call(t,o[s],s,o),(a=f[c])?(r[s]=a,a.__data__=o[s],f[c]=null):e[s]=new l(t,o[s]);for(s=0;s<h;++s)(a=n[s])&&f[_[s]]===a&&(i[s]=a)}function p(t,n){return t<n?-1:t>n?1:t>=n?0:NaN}function _(t){return function(){this.removeAttribute(t)}}function d(t){return function(){this.removeAttributeNS(t.space,t.local)}}function v(t,n){return function(){this.setAttribute(t,n)}}function m(t,n){return function(){this.setAttributeNS(t.space,t.local,n)}}function y(t,n){return function(){var e=n.apply(this,arguments);null==e?this.removeAttribute(t):this.setAttribute(t,e)}}function g(t,n){return function(){var e=n.apply(this,arguments);null==e?this.removeAttributeNS(t.space,t.local):this.setAttributeNS(t.space,t.local,e)}}function w(t){return function(){this.style.removeProperty(t)}}function A(t,n,e){return function(){this.style.setProperty(t,n,e)}}function x(t,n,e){return function(){var r=n.apply(this,arguments);null==r?this.style.removeProperty(t):this.style.setProperty(t,r,e)}}function b(t){return function(){delete this[t]}}function S(t,n){return function(){this[t]=n}}function E(t,n){return function(){var e=n.apply(this,arguments);null==e?delete this[t]:this[t]=e}}function N(t){return t.trim().split(/^|\s+/)}function C(t){return t.classList||new M(t)}function M(t){this._node=t,this._names=N(t.getAttribute("class")||"")}function L(t,n){for(var e=C(t),r=-1,i=n.length;++r<i;)e.add(n[r])}function P(t,n){for(var e=C(t),r=-1,i=n.length;++r<i;)e.remove(n[r])}function q(t){return function(){L(this,t)}}function O(t){return function(){P(this,t)}}function D(t,n){return function(){(n.apply(this,arguments)?L:P)(this,t)}}function B(){this.textContent=""}function T(t){return function(){this.textContent=t}}function j(t){return function(){var n=t.apply(this,arguments);this.textContent=null==n?"":n}}function z(){this.innerHTML=""}function H(t){return function(){this.innerHTML=t}}function I(t){return function(){var n=t.apply(this,arguments);this.innerHTML=null==n?"":n}}function R(){this.nextSibling&&this.parentNode.appendChild(this)}function U(){this.previousSibling&&this.parentNode.insertBefore(this,this.parentNode.firstChild)}function k(){return null}function V(){var t=this.parentNode;t&&t.removeChild(this)}function X(t,n,e){var r=Ct(t),i=r.CustomEvent;i?i=new i(n,e):(i=r.document.createEvent("Event"),e?(i.initEvent(n,e.bubbles,e.cancelable),i.detail=e.detail):i.initEvent(n,!1,!1)),t.dispatchEvent(i)}function $(t,n){return function(){return X(this,t,n)}}function F(t,n){return function(){return X(this,t,n.apply(this,arguments))}}function G(t,n){this._groups=t,this._parents=n}function J(){return new G([[document.documentElement]],Rt)}var K="http://www.w3.org/1999/xhtml",Q={svg:"http://www.w3.org/2000/svg",xhtml:K,xlink:"http://www.w3.org/1999/xlink",xml:"http://www.w3.org/XML/1998/namespace",xmlns:"http://www.w3.org/2000/xmlns/"},W=function(t){var n=t+="",e=n.indexOf(":");return e>=0&&"xmlns"!==(n=t.slice(0,e))&&(t=t.slice(e+1)),Q.hasOwnProperty(n)?{space:Q[n],local:t}:t},Y=function(t){var r=W(t);return(r.local?e:n)(r)},Z=function(t){return function(){return this.matches(t)}};if("undefined"!=typeof document){var tt=document.documentElement;if(!tt.matches){var nt=tt.webkitMatchesSelector||tt.msMatchesSelector||tt.mozMatchesSelector||tt.oMatchesSelector;Z=function(t){return function(){return nt.call(this,t)}}}}var et=Z,rt={};if(t.event=null,"undefined"!=typeof document){var it=document.documentElement;"onmouseenter"in it||(rt={mouseenter:"mouseover",mouseleave:"mouseout"})}var ot=function(t,n,e){var r,i,a=o(t+""),c=a.length;{if(!(arguments.length<2)){for(l=n?s:u,null==e&&(e=!1),r=0;r<c;++r)this.each(l(a[r],n,e));return this}var l=this.node().__on;if(l)for(var f,h=0,p=l.length;h<p;++h)for(r=0,f=l[h];r<c;++r)if((i=a[r]).type===f.type&&i.name===f.name)return f.value}},ut=function(t){return null==t?a:function(){return this.querySelector(t)}},st=function(t){"function"!=typeof t&&(t=ut(t));for(var n=this._groups,e=n.length,r=new Array(e),i=0;i<e;++i)for(var o,u,s=n[i],a=s.length,c=r[i]=new Array(a),l=0;l<a;++l)(o=s[l])&&(u=t.call(o,o.__data__,l,s))&&("__data__"in o&&(u.__data__=o.__data__),c[l]=u);return new G(r,this._parents)},at=function(t){return null==t?c:function(){return this.querySelectorAll(t)}},ct=function(t){"function"!=typeof t&&(t=at(t));for(var n=this._groups,e=n.length,r=[],i=[],o=0;o<e;++o)for(var u,s=n[o],a=s.length,c=0;c<a;++c)(u=s[c])&&(r.push(t.call(u,u.__data__,c,s)),i.push(u));return new G(r,i)},lt=function(t){"function"!=typeof t&&(t=et(t));for(var n=this._groups,e=n.length,r=new Array(e),i=0;i<e;++i)for(var o,u=n[i],s=u.length,a=r[i]=[],c=0;c<s;++c)(o=u[c])&&t.call(o,o.__data__,c,u)&&a.push(o);return new G(r,this._parents)},ft=function(t){return new Array(t.length)},ht=function(){return new G(this._enter||this._groups.map(ft),this._parents)};l.prototype={constructor:l,appendChild:function(t){return this._parent.insertBefore(t,this._next)},insertBefore:function(t,n){return this._parent.insertBefore(t,n)},querySelector:function(t){return this._parent.querySelector(t)},querySelectorAll:function(t){return this._parent.querySelectorAll(t)}};var pt=function(t){return function(){return t}},_t="$",dt=function(t,n){if(!t)return d=new Array(this.size()),c=-1,this.each(function(t){d[++c]=t}),d;var e=n?h:f,r=this._parents,i=this._groups;"function"!=typeof t&&(t=pt(t));for(var o=i.length,u=new Array(o),s=new Array(o),a=new Array(o),c=0;c<o;++c){var l=r[c],p=i[c],_=p.length,d=t.call(l,l&&l.__data__,c,r),v=d.length,m=s[c]=new Array(v),y=u[c]=new Array(v),g=a[c]=new Array(_);e(l,p,m,y,g,d,n);for(var w,A,x=0,b=0;x<v;++x)if(w=m[x]){for(x>=b&&(b=x+1);!(A=y[b])&&++b<v;);w._next=A||null}}return u=new G(u,r),u._enter=s,u._exit=a,u},vt=function(){return new G(this._exit||this._groups.map(ft),this._parents)},mt=function(t){for(var n=this._groups,e=t._groups,r=n.length,i=e.length,o=Math.min(r,i),u=new Array(r),s=0;s<o;++s)for(var a,c=n[s],l=e[s],f=c.length,h=u[s]=new Array(f),p=0;p<f;++p)(a=c[p]||l[p])&&(h[p]=a);for(;s<r;++s)u[s]=n[s];return new G(u,this._parents)},yt=function(){for(var t=this._groups,n=-1,e=t.length;++n<e;)for(var r,i=t[n],o=i.length-1,u=i[o];--o>=0;)(r=i[o])&&(u&&u!==r.nextSibling&&u.parentNode.insertBefore(r,u),u=r);return this},gt=function(t){function n(n,e){return n&&e?t(n.__data__,e.__data__):!n-!e}t||(t=p);for(var e=this._groups,r=e.length,i=new Array(r),o=0;o<r;++o){for(var u,s=e[o],a=s.length,c=i[o]=new Array(a),l=0;l<a;++l)(u=s[l])&&(c[l]=u);c.sort(n)}return new G(i,this._parents).order()},wt=function(){var t=arguments[0];return arguments[0]=this,t.apply(null,arguments),this},At=function(){var t=new Array(this.size()),n=-1;return this.each(function(){t[++n]=this}),t},xt=function(){for(var t=this._groups,n=0,e=t.length;n<e;++n)for(var r=t[n],i=0,o=r.length;i<o;++i){var u=r[i];if(u)return u}return null},bt=function(){var t=0;return this.each(function(){++t}),t},St=function(){return!this.node()},Et=function(t){for(var n=this._groups,e=0,r=n.length;e<r;++e)for(var i,o=n[e],u=0,s=o.length;u<s;++u)(i=o[u])&&t.call(i,i.__data__,u,o);return this},Nt=function(t,n){var e=W(t);if(arguments.length<2){var r=this.node();return e.local?r.getAttributeNS(e.space,e.local):r.getAttribute(e)}return this.each((null==n?e.local?d:_:"function"==typeof n?e.local?g:y:e.local?m:v)(e,n))},Ct=function(t){return t.ownerDocument&&t.ownerDocument.defaultView||t.document&&t||t.defaultView},Mt=function(t,n,e){var r;return arguments.length>1?this.each((null==n?w:"function"==typeof n?x:A)(t,n,null==e?"":e)):Ct(r=this.node()).getComputedStyle(r,null).getPropertyValue(t)},Lt=function(t,n){return arguments.length>1?this.each((null==n?b:"function"==typeof n?E:S)(t,n)):this.node()[t]};M.prototype={add:function(t){var n=this._names.indexOf(t);n<0&&(this._names.push(t),this._node.setAttribute("class",this._names.join(" ")))},remove:function(t){var n=this._names.indexOf(t);n>=0&&(this._names.splice(n,1),this._node.setAttribute("class",this._names.join(" ")))},contains:function(t){return this._names.indexOf(t)>=0}};var Pt=function(t,n){var e=N(t+"");if(arguments.length<2){for(var r=C(this.node()),i=-1,o=e.length;++i<o;)if(!r.contains(e[i]))return!1;return!0}return this.each(("function"==typeof n?D:n?q:O)(e,n))},qt=function(t){return arguments.length?this.each(null==t?B:("function"==typeof t?j:T)(t)):this.node().textContent},Ot=function(t){return arguments.length?this.each(null==t?z:("function"==typeof t?I:H)(t)):this.node().innerHTML},Dt=function(){return this.each(R)},Bt=function(){return this.each(U)},Tt=function(t){var n="function"==typeof t?t:Y(t);return this.select(function(){return this.appendChild(n.apply(this,arguments))})},jt=function(t,n){var e="function"==typeof t?t:Y(t),r=null==n?k:"function"==typeof n?n:ut(n);return this.select(function(){return this.insertBefore(e.apply(this,arguments),r.apply(this,arguments)||null)})},zt=function(){return this.each(V)},Ht=function(t){return arguments.length?this.property("__data__",t):this.node().__data__},It=function(t,n){return this.each(("function"==typeof n?F:$)(t,n))},Rt=[null];G.prototype=J.prototype={constructor:G,select:st,selectAll:ct,filter:lt,data:dt,enter:ht,exit:vt,merge:mt,order:yt,sort:gt,call:wt,nodes:At,node:xt,size:bt,empty:St,each:Et,attr:Nt,style:Mt,property:Lt,classed:Pt,text:qt,html:Ot,raise:Dt,lower:Bt,append:Tt,insert:jt,remove:zt,datum:Ht,on:ot,dispatch:It};var Ut=function(t){return"string"==typeof t?new G([[document.querySelector(t)]],[document.documentElement]):new G([[t]],Rt)},kt=function(t){return"string"==typeof t?new G([document.querySelectorAll(t)],[document.documentElement]):new G([null==t?[]:t],Rt)};t.select=Ut,t.selectAll=kt,Object.defineProperty(t,"__esModule",{value:!0})});
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="d3.min.js"></script>
<script>
d3.select("body").append("h1").text("Hello, world!");
</script>
export {
event,
select,
selectAll
} from "d3-selection";
{
"name": "d3-custom-example",
"version": "0.0.1",
"scripts": {
"prepublish": "rollup -c && uglifyjs d3.js -c -m -o d3.min.js"
},
"devDependencies": {
"d3-selection": "1",
"rollup": "0.36",
"rollup-plugin-node-resolve": "2",
"uglify-js": "2"
}
}
import node from "rollup-plugin-node-resolve";
export default {
entry: "index.js",
format: "umd",
moduleName: "d3",
plugins: [node()],
dest: "d3.js"
};
@adriennn
Copy link

it seems to be "prepublishOnly"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment