Building HTM Systems (WIP Document)

I am not sure I agree with react being in the way or hampering development there is a reason it is so popular and used in production as much as it is. I have been using it without issues for a very long time. You are not using jQuery and the components are view only basically requiring only state changes when you need to rebuild the component. The page should only rerender when you change state and that “rerender” may actually not do anything if the non d3 elements haven’t changed. I am also not sure using a new framework (Vue) is the answer as it is not that different then React under the covers and any issue you run into with React you will most likely run into with Vue. I will take a look at why your page is rerending now. btw React has been shown to be much more performant then using something like jQuery.

1 Like

So first thing i notice is you are changing state on the value on hover. Is that something you want? If it is you are rebuilding the d3 diagram every time you hover which is the wrong thing to do so you would just not re-build the grid on value changes. That is why your lag is happening. Also you don’t need a my = this, you can just use arrow functions which will bind this in scope on declaration.

Let me know if you have a branch that i can pull and i can lend a hand at next live stream. Have no fear :slight_smile: there is easy fix for your issue :slight_smile:


Just take a look at master. It has the latest React. One thing I noticed was that closing the debugging console prevented the lag I was seeing :man_shrugging:.

I will be working on this today (offline) and tomorrow (live streaming).

sounds good, let me know if you have issues with updating value in the state (i am not sure that is what you want and if it is there is different way to do it)

yeah so i see you have sliced up my code in the SimpleScalarEncoder component breaking the updating (i can explain why it breaks it tomorrow in live stream) but i went into my fork and switched the scrubber to just use a input element for now (with high/low etc) and it is very performant (notice below the Value input changing whiile hovering in d3 changes – d3<->react very fast)…

so the issue is with your code changes that i can point out. I think it makes sense to use the input element for now instead of the number scrubber

this is the Number scrubber i changed …

import React from 'react'
import PropTypes from 'prop-types'

const style =  { 
	border: 'solid gray 1px', 
	borderRadius: '4px', 
	fontWeight: 'bold',
	padding: '2px',

const Number = ({ high = 100, low = 0, onUpdate, precision = 0, value = 0}) =>  <input type="number" min={low} max={high} style={style} value={value} onChange={(e) => onUpdate(} step="1" />
Number.propTypes = {
	high: PropTypes.number,
	low: PropTypes.number,
	onUpdate: PropTypes.func.isRequired,
	precision: PropTypes.number,
	value: PropTypes.any,

export default Number
1 Like

Skipping ahead to the SP…

We’ve made it partially through encoders, but everyone would rather skip ahead to Spatial Pooling. So we are going to skip some encoders so we can prepare for Spatial Pooling visuals.

So next up is a streaming combined encoder:


We’ll be working on this Thursday 9am. See my events for details. Next week, if that goes well, we’ll start on the “potential pools” diagram:


But we need the combined encoding first, because it will be a part of the potential pools diagram.

I hope you will be able to join me on Twitch if interested!


I’ve abandoned Trello and moved all issues into Github Projects (which is very nice!). I will go over this tomorrow in the live-stream, but I’ve broken work out into 3 projects (so far).

I’ve created all the issues we need to get us to the point where we need to actually build out the spatial pooling algorithm. Before we get there, we have a couple encoding-related tasks we must work on to set up the “input space” for the SP.



Knocked out two tasks on the live stream today. See the latest build here.

Big thanks to @David_Duckworth for his help with React and JavaScript.

1 Like

Good progress today. See it live at

1 Like

I think it is time to create a Spatial Pooler.


Tomorrow we’ll create the minicolumn competition that simulates inhibition. Skipping local inhibition and topology at this point.

1 Like

Yesterday I had some trouble getting learning working, but I found the problem today and finished up.

On Monday, we’ll finish up the learning bit and start tracking active duty cycles. This will set the stage for implementing boosting.



Next stream will be this afternoon on YouTube, where I’ll be writing prose describing Spatial Pooling.


I had to update the link, sorry. Technical difficulties.

1 Like

Check out the Spatial Pooler prose so far.


I’ll be continuing writing prose for the SP today about the minicolumn competition. Tune in at 1PM PDT.

Live-coding Active / Overlap Duty Cycles (again) in about 15 minutes.

I got duty cycles working properly on my fork (both active and overlap). I just ignored performance and cached 1000 time steps. After testing on the website, it did not slow anything down, so let’s roll with it. I’ll be explaining the code and merging / deploying today, then we’ll create the overlay duty cycle diagram.

Today we created stack-ranked minicolumn competition diagram.

See it live at


Hey folks, I am taking a break from the live-coding so I can do some code cleanup and make fast progress on my backlog. I’m also focusing a lot right now on learning Deep Learning. So I won’t be live-coding on this series for awhile. Just a heads-up. You can continue watching my progress on the Github Project Tracker and see all changes on the staging server.

1 Like