Matchu
71215fe599
The layer preloader already takes advantage of, and primes, the HTTP cache. But we still do duplicate work, on every OutfitPreview render, to re-execute movie clip libraries, and create a movie clip to test for animations. The former is nontrivial cost, and the latter is often large cost. This can make even basic outfit changes slow, when there's no change to the movie clip layers and the player is paused! Here, we add an LRU cache for movie clip libraries, and for the question of "is it animated?". This should speed up a number of places where we would reload the movie (including between toggling the item), and various changes that were triggering full movie clip rebuilds unnecessarily. We _aren't_ solving here for the fact that toggling an animated item requires rebuilding the movie clip, which could conceivably be cached—but with some state management trickiness, because ideally it should be a separate clip for each context where it's being shown. Imo not yet worth the effort! (esp because I think users understand that toggling an animated item can be slow, whereas this was affecting _other_ actions way too much)
104 lines
4.5 KiB
JSON
104 lines
4.5 KiB
JSON
{
|
|
"name": "impress-2020-app",
|
|
"version": "0.1.0",
|
|
"private": true,
|
|
"dependencies": {
|
|
"@apollo/client": "^3.3.7",
|
|
"@apollographql/graphql-playground-html": "^1.6.24",
|
|
"@auth0/auth0-react": "^1.0.0",
|
|
"@chakra-ui/icons": "^1.0.4",
|
|
"@chakra-ui/react": "^1.3.3",
|
|
"@chakra-ui/theme-tools": "^1.0.3",
|
|
"@emotion/react": "^11.1.4",
|
|
"@emotion/styled": "^11.0.0",
|
|
"@loadable/component": "^5.12.0",
|
|
"@sendgrid/mail": "^7.2.6",
|
|
"@sentry/react": "^5.30.0",
|
|
"@sentry/tracing": "^5.30.0",
|
|
"@testing-library/jest-dom": "^4.2.4",
|
|
"@testing-library/react": "^9.3.2",
|
|
"@testing-library/user-event": "^7.1.2",
|
|
"@types/node": "^14.14.22",
|
|
"@types/react": "^17.0.1",
|
|
"@types/react-dom": "^17.0.0",
|
|
"apollo-link-persisted-queries": "^0.2.2",
|
|
"apollo-server": "^2.19.2",
|
|
"apollo-server-core": "^2.19.2",
|
|
"apollo-server-env": "^3.0.0",
|
|
"aws-sdk": "^2.726.0",
|
|
"canvas": "^2.6.1",
|
|
"dataloader": "^2.0.0",
|
|
"dompurify": "^2.2.0",
|
|
"framer-motion": "^3.1.1",
|
|
"graphql": "^15.5.0",
|
|
"honeycomb-beeline": "^2.2.0",
|
|
"immer": "^8.0.1",
|
|
"jimp": "^0.14.0",
|
|
"jsonwebtoken": "^8.5.1",
|
|
"jwks-rsa": "^1.9.0",
|
|
"lru-cache": "^6.0.0",
|
|
"mysql2": "^2.1.0",
|
|
"node-fetch": "^2.6.0",
|
|
"react": "^17.0.1",
|
|
"react-autosuggest": "^10.0.2",
|
|
"react-dom": "^17.0.1",
|
|
"react-icons": "^4.2.0",
|
|
"react-router-dom": "^5.1.2",
|
|
"react-scripts": "^4.0.1",
|
|
"react-transition-group": "^4.3.0",
|
|
"simple-markdown": "^0.7.2",
|
|
"typescript": "^4.1.3",
|
|
"xmlrpc": "^1.3.2"
|
|
},
|
|
"scripts": {
|
|
"start": "TS_NODE_COMPILER=typescript-cached-transpile vercel dev",
|
|
"dev": "yarn build-cached-data && REACT_APP_IMPRESS_LOG_IN_AS=$IMPRESS_LOG_IN_AS react-scripts start",
|
|
"build": "yarn build-cached-data && react-scripts build",
|
|
"vercel-build": "yum install libuuid-devel libmount-devel && cp /lib64/{libuuid,libmount,libblkid}.so.1 node_modules/canvas/build/Release/",
|
|
"test": "react-scripts test --env=jsdom",
|
|
"cypress": "cypress open",
|
|
"eject": "react-scripts eject",
|
|
"mysql": "mysql --host=impress.openneo.net --user=$(dotenv -p IMPRESS_MYSQL_USER) --password=$(dotenv -p IMPRESS_MYSQL_PASSWORD) --database=openneo_impress",
|
|
"mysql-dev": "mysql --host=localhost --user=impress_2020_dev --password=impress_2020_dev --database=impress_2020_dev",
|
|
"mysql-admin": "mysql --host=impress.openneo.net --user=matchu --password --database=openneo_impress",
|
|
"mysqldump": "mysqldump --host=impress.openneo.net --user=$(dotenv -p IMPRESS_MYSQL_USER) --password=$(dotenv -p IMPRESS_MYSQL_PASSWORD) --column-statistics=0",
|
|
"download-mysql-schema": "yarn --silent mysqldump --no-data openneo_impress closet_hangers closet_lists items item_translations modeling_logs parents_swf_assets pet_types pet_states swf_assets users | sed 's/ AUTO_INCREMENT=[0-9]*//g' > scripts/setup-mysql-dev-schema.sql && yarn --silent mysqldump openneo_impress species species_translations colors color_translations zones zone_translations > scripts/setup-mysql-dev-constants.sql",
|
|
"setup-mysql": "yarn mysql-admin < scripts/setup-mysql.sql",
|
|
"setup-mysql-dev": "yarn mysql-dev < scripts/setup-mysql-dev-constants.sql && yarn mysql-dev < scripts/setup-mysql-dev-schema.sql",
|
|
"build-cached-data": "ts-node --compiler=typescript-cached-transpile --transpile-only -r dotenv/config scripts/build-cached-data.js",
|
|
"cache-asset-manifests": "ts-node --compiler=typescript-cached-transpile --transpile-only -r dotenv/config scripts/cache-asset-manifests.js",
|
|
"delete-user": "ts-node --compiler=typescript-cached-transpile --transpile-only -r dotenv/config scripts/delete-user.js",
|
|
"export-users-to-auth0": "ts-node --compiler=typescript-cached-transpile --transpile-only -r dotenv/config scripts/export-users-to-auth0.js"
|
|
},
|
|
"eslintConfig": {
|
|
"extends": "react-app"
|
|
},
|
|
"browserslist": {
|
|
"production": [
|
|
">0.2%",
|
|
"not dead",
|
|
"not op_mini all"
|
|
],
|
|
"development": [
|
|
"last 1 chrome version",
|
|
"last 1 firefox version",
|
|
"last 1 safari version"
|
|
]
|
|
},
|
|
"devDependencies": {
|
|
"5to6-codemod": "^1.8.0",
|
|
"apollo-server-testing": "^2.12.0",
|
|
"auth0": "^2.28.0",
|
|
"cypress": "^6.4.0",
|
|
"cypress-plugin-snapshots": "^1.4.4",
|
|
"dotenv-cli": "^3.1.0",
|
|
"es6-promise-pool": "^2.5.0",
|
|
"inquirer": "^7.3.3",
|
|
"jest-image-snapshot": "^4.3.0",
|
|
"prettier": "^2.0.5",
|
|
"react-is": "^16.13.1",
|
|
"ts-node": "^9.1.1",
|
|
"typescript-cached-transpile": "^0.0.6",
|
|
"vercel": "^21.2.3"
|
|
}
|
|
}
|