- Performance
- Code of simplicity
- Using React && RxJS
- Design concepts to be concerned later in other project
- Responsive design
- PWA and Web Component are also introduced after a time
- And so on overengineering
Main
- React (with @types)
- RxJS
- Typescript
- SCSS (with @types)
Sub
Condition
I tried to make it as slow as possible.
- Develope mode
- Disable Cache
- CPUx6 Throttling
- 2500 List
- Checkbox ON/OFF
Rendering Result: 6.4ms
To the unusual point.
App
, TodoTemplate
, and TotoInsert
are excluded from rendering.
Responsive
Fluid Size
A method of fluidly resizing in response to various devices.
It is a way to respond to the distance between the eye and the device, the size and resolution of the device.
Principle
Use visual angles to determine the fit size
(I called) for each device.
source: Legibility: how to make text convenient to read,
Calculation process
- Size specification
- Angle calculations in the devices that would look the smallest(or can you specify which device to reference?)
- Generate a
fit size
for each device based on the angle - Provides fluidity between devices