FEAT Infinite scroll works. Sort-of.
I've implemented a Cards/Card interface, but it's heavy and direct,
with absolutely not a care in the world about how much memory your
browser can give me. It only moves forward in time, and accumulates as
it goes. The React is brutal and heavy, but for a prototype, eh... it's
a prototype.
I'm a firm believer in prototypes.
Criticism: "Cards" is doing too much, and not enough. It would make
more sense to have a moving window, showing no more than what it would
take to show the user what is expected at that moment, with the ability
to load high and low, keeping only what the user is _looking at_ in the
DOM tree.
Proposal: Cards needs a CardCollection proxy object, which the Cards view
object (personal convention: TSX files are named for what they show,
semantically; TS files may be suffixed with "Model" or "Collection",
a'la Backbone, to seperate them from the views, if needed; "Model"
objects are very rarely needed) taps it as the user moves up and down;
the IntersectionObserver tool would be pretty good for this; and if the
proxy actually _cached_ the fields it had already seen, it wouldn't be
slow at all.
The proxy object could also support the search feature by keeping two
collections: one of the "whole" set, and one of the "last search" set;
the proxy could swap between them as needed.
Enhancement: Well, it could use a "zoom" feature with a nice overlay.
It might even be lovely to have a second page with all the things I
haven't shown, like attributes, subtype, rarity (not, not the pony),
or keywords.
Enhancement: It is possible to search based on set, attributes, and so
forth, so a sidebar with those as filters would also be kinda cool.
2020-09-16 02:41:37 +00:00
|
|
|
|
|
|
|
|
.PHONY: all
|
|
|
|
|
all: help
|
|
|
|
|
|
|
|
|
|
.PHONY: help
|
|
|
|
|
help:
|
|
|
|
|
@M=$$(perl -ne 'm/((\w|-)*):.*##/ && print length($$1)."\n"' Makefile | \
|
|
|
|
|
sort -nr | head -1) && \
|
|
|
|
|
perl -ne "m/^((\w|-)*):.*##\s*(.*)/ && print(sprintf(\"%s: %s\t%s\n\", \$$1, \" \"x($$M-length(\$$1)), \$$3))" Makefile
|
|
|
|
|
|
|
|
|
|
./node_modules/.yarn-integrity: package.json
|
|
|
|
|
yarn install
|
|
|
|
|
|
|
|
|
|
./build/asset-manifest.json: ./node_modules/.yarn-integrity src/App.tsx src/cards/Cards.tsx src/cards/Card.tsx
|
|
|
|
|
yarn build
|
|
|
|
|
|
|
|
|
|
.PHONY: install
|
|
|
|
|
install: ./node_modules/.yarn-integrity ## Install any yarn packages necessary
|
|
|
|
|
|
|
|
|
|
.PHONY: build
|
|
|
|
|
build: ./build/asset-manifest.json ## Build the package if it is out of date
|
|
|
|
|
|
|
|
|
|
.PHONY: serve
|
2020-09-17 00:37:51 +00:00
|
|
|
serve: build/asset-manifest.json ## Do everything necessary to run an optimized build
|
FEAT Infinite scroll works. Sort-of.
I've implemented a Cards/Card interface, but it's heavy and direct,
with absolutely not a care in the world about how much memory your
browser can give me. It only moves forward in time, and accumulates as
it goes. The React is brutal and heavy, but for a prototype, eh... it's
a prototype.
I'm a firm believer in prototypes.
Criticism: "Cards" is doing too much, and not enough. It would make
more sense to have a moving window, showing no more than what it would
take to show the user what is expected at that moment, with the ability
to load high and low, keeping only what the user is _looking at_ in the
DOM tree.
Proposal: Cards needs a CardCollection proxy object, which the Cards view
object (personal convention: TSX files are named for what they show,
semantically; TS files may be suffixed with "Model" or "Collection",
a'la Backbone, to seperate them from the views, if needed; "Model"
objects are very rarely needed) taps it as the user moves up and down;
the IntersectionObserver tool would be pretty good for this; and if the
proxy actually _cached_ the fields it had already seen, it wouldn't be
slow at all.
The proxy object could also support the search feature by keeping two
collections: one of the "whole" set, and one of the "last search" set;
the proxy could swap between them as needed.
Enhancement: Well, it could use a "zoom" feature with a nice overlay.
It might even be lovely to have a second page with all the things I
haven't shown, like attributes, subtype, rarity (not, not the pony),
or keywords.
Enhancement: It is possible to search based on set, attributes, and so
forth, so a sidebar with those as filters would also be kinda cool.
2020-09-16 02:41:37 +00:00
|
|
|
yarn run http-server build/
|
|
|
|
|
|
|
|
|
|
.PHONY: dev
|
|
|
|
|
dev: ./node_modules/.yarn-integrity ## Run the server in "dev" mode, with hot reload
|
|
|
|
|
yarn start
|
2020-09-17 00:37:51 +00:00
|
|
|
|
|
|
|
|
.PHONY: dockerize
|
|
|
|
|
dockerize: ## Generate a docker image with an optimized build and a simple fileserver
|
|
|
|
|
docker build --tag elderscrolling:1.0 .
|
|
|
|
|
|