Running Simulations

This guide walks you through the complete process of setting up and running a scheduling simulation, from algorithm selection to real-time visualization.

​

Selecting an Algorithm

The simulator supports five CPU scheduling algorithms, each with distinct characteristics:

​

How to Select

On the initial screen (pantallaInicio), click the button corresponding to your desired algorithm. The seleccionarAlgoritmo(tipo) function will:

1. Set the global variable algoritmoActual to your selection
2. Hide the start screen
3. Show the input form screen
4. Update the title to display your chosen algorithm name

​

Entering Process Data

After selecting an algorithm, you’ll configure the simulation parameters.

​

Step 1: Specify Number of Processes

​

Step 2: Configure Algorithm-Specific Parameters

Depending on your chosen algorithm, additional fields will appear:

​

Step 3: Fill Process Parameters

For each process, you’ll see a section labeled “Proceso 1”, “Proceso 2”, etc. Arrival Time (Llegada):

• The time unit when the process arrives in the system
• Can be 0 for processes that start immediately
• Processes arriving later will join the ready queue when their arrival time is reached

CPU Burst Time (CPU):

• The total CPU time this process requires
• Must be a positive integer
• Represents how long the process needs to execute

Priority (Prioridad): (Priority algorithm only)

• Numeric priority value
• Determines execution order
• Check algorithm implementation for whether lower or higher values have priority

​

Running a Simulation

​

Control Buttons

The results screen provides four control buttons to manage the visualization:

​

▶ Iniciar (Start)

Function: iniciarSimulacion()

• Begins the step-by-step animation
• Updates every 500 milliseconds (0.5 seconds)
• Advances through the timelineGlobal array
• Calls renderPaso() for each time unit

What happens during animation:

1. CPU box updates to show the executing process (or “Idle”)
2. Ready queue displays waiting processes with animated pulse effect
3. Gantt chart adds a new block for each time unit
4. Timeline auto-scrolls horizontally to show the latest block

​

⏸ Pausar (Pause)

Function: pausarSimulacion()

• Stops the animation at the current step
• Preserves the current state (doesn’t reset)
• Click “Iniciar” again to resume from the paused position
• Uses clearInterval() to stop the animation timer

​

🔄 Reiniciar (Reset)

Function: reiniciarSimulacion()

• Resets pasoActual to 0
• Clears all visual components:
  • CPU box resets to ”-”
  • Ready queue becomes empty
  • Gantt chart clears all blocks
• Preserves the results table and calculated metrics
• Click “Iniciar” to watch the simulation from the beginning

​

⬅ Volver al inicio (Back to Start)

Function: volverInicio()

• Returns to the algorithm selection screen
• Clears all data:
  • Timeline and step counter
  • Visual components (CPU, queue, Gantt)
  • Results table
  • Input fields and values
• Hides results and form screens
• Use this to start a completely new simulation

​

Real-Time Visualization Features

As the simulation runs, observe these dynamic elements:

CPU Box Updates

The CPU box (cpuBox) changes every 500ms:

• ”-”: Initial state, no simulation started
• “Idle”: CPU is not executing any process (waiting for arrivals or queue is empty)
• “P1”, “P2”, “P3”, etc.: Shows which process is currently executing

The box has a visually striking gradient (indigo to purple) and is 32x32 pixels, making it easy to track.

Queue Animation

The colaBox shows processes in the ready queue:

• Each process appears as a rounded gray box with padding
• Boxes have a pulse animation (animate-pulse class)
• For FIFO and SJF: Simple array of process IDs
• For Round Robin: Processes cycle through as they use their quantum
• For MLFQ: Multiple queue levels can be visible (nested structure)

The queue dynamically updates as processes arrive, execute, complete, or change priority levels.

Gantt Chart Construction

The ganttLive timeline builds from left to right:

• Each time unit adds one 8x8 pixel block
• Blocks are indigo-colored and rounded
• Display the executing process ID or ”-” for idle
• Hover over blocks for a scale effect (1.1x zoom)
• Container auto-scrolls to keep the latest block visible
• Horizontal scrollbar appears for long simulations

This creates a complete visual history of CPU usage over time.

​

Timeline Generation

The simulator uses different timeline generation methods based on the algorithm: Basic Timeline (FIFO, SJF, Priority):

• generarTimelineBasico() creates a snapshot for each time unit
• Determines which process is executing at time t
• Queue information is limited (not dynamically tracked)

Round Robin Timeline:

• generarTimelineRR() simulates the circular queue behavior
• Tracks remaining CPU time for each process
• Processes are added to the queue as they arrive
• After using quantum, process goes to the back of the queue
• Accurately shows queue state at each time unit

MLFQ Timeline:

• generarTimelineMLFQ() manages multiple priority queues
• New processes start in the highest priority queue (queue 0)
• Processes use quantum for their current level
• If not completed, process moves to the next lower priority queue
• Shows complex queue dynamics across multiple levels

​

Example Workflow

Here’s a complete example of running a Round Robin simulation: