Refactor playgameoflife.live - Utilize JSXGraph the React Way
Leslie Wong
Guangdong, China
Abstract
Motivation
Spending some time refactoring the JSXGraph-based game of life implementation Playgameoflife.live several months ago, I deem it would be worth presenting a talk, and share some experience using JSXGraph within the react ecosystem. Upon reflection, there are three points worth mentioning.
- The way to run JSXGraph, from the sequential way with a script tag to the class way with the useEffect hook in a react functional component.
- Architecture migration, from Heroku to AWS SAM.
- The encoder and decoder implementation of RLE file, the popular format to share game of life patterns.
Proposition Definition
The universe of the Game of Life is an infinite, two-dimensional orthogonal grid of square cells, each of which is in one of two possible states, alive and dead, (or populated and unpopulated, respectively). Every cell interacts with its eight neighbors, which are the cells that are horizontally, vertically, or diagonally adjacent. At each step in time, the following transitions occur:
- For a box with a live cell:
- There existing fewer than two live neighbors, the cell dies, due to loneliness.
- There existing more than three live neighbors, the cell dies, due to crowding.
- There existing two or three live neighbors, the cell lives on to the next generation.
- For an empty box or a box with a dead cell:
- There existing three neighbors, the box generates a new live cell, as if by reproduction.
Further Details
For further refactor details, please refer to https://github.com/Leslie-Wong-H/game_of_life.