pomber

function App({ items }) {
  const [itemId, setItemId] = useState(null)
  const [startTransition, prepareTransition] = useTransition(newId => setItemId(newId), {
    timeoutMs: 1000
  })
  return (
    <Suspense fallback='Loading...'>
      {itemId === null ? (
        <ul>
          {items.map(item => (

pomber

(function(frames = 200, colWidth = "2px") {
  const container = document.createElement("div");
  container.style.position = "fixed";
  container.style.right = "10px";
  container.style.top = "0";
  container.style.zIndex = "99999";
  for (let i = 0; i < frames; i++) {
    const fc = document.createElement("div");
    fc.style.background = "red";
    fc.style.width = colWidth;

pomber

Our intellectual powers are rather geared to master static relations and ... our powers to visualize processes evolving in time are relatively poorly developed. For that reason we should do (as wise programmers aware of our limitations) our utmost to shorten the conceptual gap between the static program and the dynamic process, to make the correspondence between the program (spread out in text space) and the process (spread out in time) as trivial as possible.
--- Dijkstra (1968) "A Case against the GO TO Statement" cited in: Bill Curtis (1981) Tutorial, human factors in software development. p. 109.

pomber

suggest_who_to_follow
suggest_recap
suggest_recycled_tweet
suggest_recycled_tweet_inline
suggest_activity_tweet
suggest_pyle_tweet
suggest_ranked_timeline_tweet

pomber

const buttonHtml = `
<a id="thanos" class="btn btn-primary float-right" role="button"
  style="margin-left:38px">
  Decimate issues
</a>`;


var css = '#thanos:hover{ background-image: linear-gradient(-180deg,#6d3678,#693270 90%) }';
var style = document.createElement('style');

pomber

import React from "react"
import { globalHistory } from "@reach/router"
import Zoom from "./Zoom"
import Slide from "./Slide"
import Pre from "./Pre"
import Clock from "./Clock"

// based on https://github.com/streamich/react-use/blob/master/src/useSpring.ts
import { SpringSystem } from "rebound"
import { useState, useEffect } from "react"

pomber

// Effect tags
const PLACEMENT = 1;
const DELETION = 2;
const UPDATE = 3;

function arrify(val) {
  return val == null ? [] : Array.isArray(val) ? val : [val];
}

function reconcileChildrenArray(wipFiber, newChildElements) {

pomber

{
  "presets": ["@babel/preset-react", "@babel/preset-env"]
}

pomber

class App extends React.Component {
  state = {
    selectedStock: null
  };
  render() {
    const { stocks } = this.props;
    const { selectedStock } = this.state;
    return (
      <React.Suspense fallback={<div>Loading...</div>}>
        <StockTable

pomber

const stockChartPromise = import("./StockChart");
const StockChart = React.lazy(() => stockChartPromise);