Visual Memory Cache Simulator (school project)
TL;DR: A Web GUI, displaying, step by step, the Cache and Memory values changing. It's very didactic actually.
Backend: REST JSON API provided by Flask. There's a Python Script that reads a trace file (usually generated by the DINERO IV), and return python dicts (kind off JSONs). Flask than get its returns and serve it with the API.
Frontend. Made with VueJS and Quasar Framework. It looks really better in a PC than in a Phone. After the user submit a trace file and set some options, it produces a nice interface, showing the Memory and Cache data in each step. Unfortunately, it is doing some processing in the JSON received, because the teacher requested the Layers to be shown in an unexpected way. Since I'm not sure it the display logic will still the same, I didn't want to change the API data layout: it is more clear and makes more sense.
TODO:
- Frontend: Make the Play button work (it will auto advance a step each X seconds)
- Back and Front: Highlight the relevant (changed) rows in each step
useful links:
dinero IV http://pages.cs.wisc.edu/~markhill/DineroIV/
VueJS: https://vuejs.org/
Quasar-Framework: http://quasar-framework.org/
Python: https://www.python.org/
Flask: http://flask.pocoo.org/