Skip to content

Instantly share code, notes, and snippets.

View m1010j's full-sized avatar

Matthias Jenny m1010j

View GitHub Profile
@m1010j
m1010j / machine.js
Last active June 2, 2020 16:41
Generated by XState Viz: https://xstate.js.org/viz
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@m1010j
m1010j / machine.js
Last active May 29, 2020 22:17
Generated by XState Viz: https://xstate.js.org/viz
View machine.js
const questionMachine = Machine(
{
id: 'question',
initial: '47475c25-8e0f-4115-a55a-4dc643ae50a2',
context: { currentStep: 0, totalNumberOfSteps: 8, followupStep: 0 },
states: {
complete: { type: 'final' },
'47475c25-8e0f-4115-a55a-4dc643ae50a2': {
on: { ANSWER: [{ target: 'a8af0f85-fa49-4531-9223-39c7ce11af7a', actions: 'incrementCurrentStep' }] },
},
@m1010j
m1010j / machine.js
Last active May 11, 2020 21:48
Generated by XState Viz: https://xstate.js.org/viz
View machine.js
const questionMachine = Machine(
{
id: 'question',
initial: '47475c25-8e0f-4115-a55a-4dc643ae50a2',
context: {
currentStep: 1,
totalNumberOfSteps: 8,
},
states: {
'47475c25-8e0f-4115-a55a-4dc643ae50a2': {
@m1010j
m1010j / machine.js
Last active May 11, 2020 19:23
Generated by XState Viz: https://xstate.js.org/viz
View machine.js
const questionMachine = Machine(
{
id: 'question',
initial: '072ecdc1-be12-4f8f-9707-15e4dd53ccc0',
context: {
currentStep: 0,
totalNumberOfSteps: 2,
followUpQuestionStep: 0,
},
states: {
View keybase.md

Keybase proof

I hereby claim:

  • I am m1010j on github.
  • I am m1010j (https://keybase.io/m1010j) on keybase.
  • I have a public key ASBcVDMZPfmmd6wCTnnCUzSiNZ9tB42o4Mqu973FjdNyFwo

To claim this, I am signing this object:

View RefHooksComponent.jsx
function RefHooksComponent(props) {
const ref = useRef(null);
if (ref.current === null) {
ref.current = expensiveCalculation(props.arg);
}
const result = ref.current;
// ...
}
View FunctionHooksComponent.jsx
function FunctionHooksComponent(props) {
const [result] = useState(() => expensiveCalculation(props.arg));
// ...
}
View MemoHooksComponent.jsx
function MemoHooksComponent(props) {
const { arg } = props;
const result = useMemo(() => expensiveCalculation(arg), [arg]);
// ...
}
View NaiveHooksComponent.jsx
function NaiveHooksComponent(props) {
const [result] = useState(expensiveCalculation(props.arg));
// ...
}
View ClassComponent.jsx
class ClassComponent extends React.Component {
constructor(props) {
super(props);
this.state = { result: expensiveCalculation(this.props.arg) };
}
// ...
}