mxstbr

import { useEffect } from "react";
import { Detail, open } from "@raycast/api";
import { useExec } from "@raycast/utils";
import Papa from "papaparse";

type Row = {
  // "On my way!"
  ZPHRASE: string;
  // omw
  ZSHORTCUT: string;

mxstbr

[short title of problem]

• Status: [proposed | rejected | accepted | deprecated | … | superseded by ADR-0005]
• Deciders: [list everyone involved in the decision]
• Links: [list all the related links]

Context and Problem Statement

[Describe the context and problem statement, e.g., in free form using two to three sentences. You may want to articulate the problem in form of a question.]

mxstbr

• Standard create-react-app
• Sets up the GraphQL provider and client, nothing else

// src/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
// Switch between them with comments
// import GraphQLProvider from "./Apollo"

mxstbr

const en = {
  titles: {
    default: `What's on your mind?`,
    idea: `Share an idea`,
    issue: `Report an issue`,
    other: `Tell us anything!`,
  },
  categories: {
    idea: `Idea`,
    issue: `Issue`,

mxstbr

type Participant {
  # The complexity of getting one thread in a thread connection is 3, and multiply that by the amount of threads fetched
  threadConnection(first: PaginationAmount, after: String): ThreadConnection @cost(complexity: 3, multiplier: "first")
}

type Thread {
  participants(first: PaginationAmount,...): [Participant] @cost(complexity: 2, multiplier: "first")
}

mxstbr

First, start Chrome and open the page you want to profile:

./chrome --js-flags=”--prof” --no-sandbox http://localhost:8080/index.html

Note: This page should do things on-load, simply close Chrome once it's done

Then preprocess the biggest .log file you get: (since the biggest one should be from the main renderer):

mxstbr

import postmark from 'postmark';
const debug = require('debug')('send-email');
const stringify = require('json-stringify-pretty-compact');

let client;
if (process.env.POSTMARK_SERVER_KEY) {
  client = new postmark.Client(process.env.POSTMARK_SERVER_KEY);
} else {
  console.log(
    '\nℹ️ POSTMARK_SERVER_KEY not provided, debug mode enabled. Will log emails instead of actually sending them.'

mxstbr

import createLogger from 'graphql-log';

let list = [];
const logExecutions = createLogger({
  logger: (name) => {
    list.push(name);
    fs.writeFileSync('resolvers.js', JSON.stringify(list, null, 2));
  },
});

mxstbr

// @flow
// Turn a callback-based listener into many async iterators without buffering
import { $$asyncIterator } from 'iterall';

type Listener = ((arg: any) => void) => Promise<any>;

const defaultOnError = (err: Error) => {
  throw new Error(err);
};

mxstbr

Keybase proof

I hereby claim:

• I am mxstbr on github.
• I am mxstbr (https://keybase.io/mxstbr) on keybase.
• I have a public key whose fingerprint is 78D3 829B 9CE0 7924 2C15 4E38 673F 4304 C9E3 A511

To claim this, I am signing this object: