mizchi

// for https://cssbattle.dev/play/2
:root {
  --size: 50px;
}

body {background: #62374e;}

body::before {
  content: "";
  width: var(--size);

mizchi

use wasm_bindgen::prelude::*;
use wasm_bindgen::JsCast;

fn run() -> Result<(), JsValue> {
    let document = web_sys::window().unwrap().document().unwrap();
    let canvas = document
        .create_element("canvas")
        .unwrap()
        .unchecked_into::<web_sys::HtmlCanvasElement>();
    canvas.set_attribute("width", "400px")?;

mizchi

// Ref https://github.com/auth0-samples/auth0-react-samples/blob/master/01-Login
import auth0 from "auth0-js";
import React, { useEffect, useState, useContext } from "react";
import ReactDOM from "react-dom";
import {
  BrowserRouter,
  Switch,
  Route,
  RouteComponentProps,
  // @ts-ignore

mizchi

import "@babel/polyfill";

import axios from "axios";
import { render, h, Fragment } from "preact";
import { useState, useEffect } from "preact/hooks";
import { ulid } from "ulid";

const AUTH_TOKEN_KEY = ":token";
const CURRENT_NAME = ulid();

mizchi

// https://rustwasm.github.io/wasm-bindgen/examples/2d-canvas.html
use wasm_bindgen::prelude::*;
use wasm_bindgen::JsCast;

#[wasm_bindgen(start)]
pub fn start() {
    web_sys::console::log_1(&"start".into());
    let document = web_sys::window().unwrap().document().unwrap();

    let canvas = document.create_element("canvas").unwrap();

mizchi

const path = require("path");

const CleanWebpackPlugin = require("clean-webpack-plugin");
const TerserPlugin = require("terser-webpack-plugin");

module.exports = {
  entry: {
    "main": "src/index"
  },
  output: {

mizchi

import React, { Suspense } from "react";
import ReactDOMServer from "react-dom/server";
import { renderRoutes, matchRoutes, MatchedRoute } from "react-router-config";
import { StaticRouter } from "react-router-dom";
import ShallowRenderer from "react-test-renderer/shallow";
import { renderAsync, createResource } from "./renderAsync";

const shallowRenderer = ShallowRenderer.createRenderer();

// data fetcher

mizchi

version: '3.3'
services:
  mysql:
    image: mysql:5.7
    command: --default-authentication-plugin=mysql_native_password
    restart: always
    ports:
      - '3306:3306'
    environment:
      MYSQL_ROOT_USER: root

mizchi

某所のための資料

やりたいこと

サーバーサイドのアプリケーションから使われるために React.Component を育ててきたが、十分育ってきたので、主従関係を逆転させて react-router に乗せて SPAにできるか実験したい。

一つのJSにまとめると巨大なので、画面ごとに必要なコードに分割したい。

今回は SSR はスコープ外とする。

mizchi

これは Google Stadia みての気持ち。Twitter みてるとなぜクラウドゲーミングが難しいか前提を理解してない人が多かったので。

注意: 雑です。

こうだから不可能だ、という話ではなく、これらの諸問題を倒してきたとしたら Google すごいなと思うし、倒してないとしたらまた一つクラウドゲーミングの夢やぶれたねという話で、今の所期待値が前者 30% 後者 70% ぐらい。

基本知識: 要求 FPS

フレームパーセカンド、一秒間にディスプレイが何回更新されるか。