PVC.js: visualizing C programs on web browsers for novices

Heliyon. 2020 Apr 23;6(4):e03806. doi: 10.1016/j.heliyon.2020.e03806. eCollection 2020 Apr.

Abstract

Many researchers have proposed program visualization tools for memory management. Examples include state-of-the-art tools for C languages such as SeeC and Python Tutor (PT). However, three problems hinder the use of these and other tools: capability (P1), installability (P2), and usability (P3). (P1) Tools do not fully support dynamic memory allocation or File Input / Output (I/O) and Standard Input. (P2) Novice programmers often have difficulty installing SeeC due to its dependence on Clang and setting up an offline environment that uses PT. (P3) Revisualization of the modified source code in SeeC requires several steps. To alleviate these issues, we propose a new visualization tool called PlayVisualizerC.js (PVC.js). PVC.js, which is designed for novice C language programmers to provide solutions (S1-3) for P1-3. S1 offers complete support for dynamic memory allocation, standard I/O, and file I/O. S2 involves installation in a user web browser. This system is composed of JavaScript programs, including C language execution functions. S3 reduces the steps required for revisualization. To evaluate PVC.js, we conducted two experiments. The first experiment found that students using PVC solved a set of four programming tasks on average 1.7-times faster and with 19% more correct answers than those using SeeC. The second experiment found that PVC.js has a visualization performance equivalent to PT, and that PVC.js is more effective than existing general debugging tools for novices to understand programs in cases where the values of important variables change and the control flow is complicated.

Keywords: Browser application; C language; Science; Visualization.