Simplify landing page JS and fix broken scaling section

Merged
SB
8mo ago
+75-217

User description

User description

Summary

  • Replace ~185 lines of imperative createElement/appendChild DOM manipulation with declarative innerHTML template literals (~65 lines)
  • Fix the weak scaling section which was broken: SVG images were never displayed and the label was rendered twice due to a copy-paste bug (middiv created but never appended, botdiv duplicating the label)
  • Remove unnecessary FS/FScale classes, commented-out HTML template, onHTML wrapper, and implicit global variable

Test plan

  • Open docs/index.html locally and verify Featured Simulations cards render identically (image, logo, title, link icon, metadata row)
  • Verify Weak Scaling Results section now shows SVG charts with labels underneath
  • Verify Contributors section loads avatars from GitHub API
  • Verify Download badge shows latest release version
  • Build documentation with ./mfc.sh build -t documentation (verified locally)

đŸ¤– Generated with Claude Code


PR Type

Enhancement


Description

  • Replace imperative DOM manipulation with declarative innerHTML templates

  • Fix broken weak scaling section: SVG images now display with correct labels

  • Remove unnecessary FS/FScale classes and onHTML wrapper function

  • Simplify simulation data to plain objects instead of class instances


Diagram Walkthrough

flowchart LR
  A["Imperative DOM<br/>createElement/appendChild"] -->|"Replace with"| B["Declarative innerHTML<br/>Template literals"]
  C["FS/FScale Classes"] -->|"Simplify to"| D["Plain Objects"]
  E["Broken Scaling Section<br/>Missing SVG/Duplicate labels"] -->|"Fix with"| F["Correct HTML Structure<br/>Single label per chart"]
  B --> G["Cleaner, Maintainable Code"]
  D --> G
  F --> G

File Walkthrough

Relevant files
Enhancement
index.htmlSimplify DOM manipulation and fix scaling section bugs     

docs/index.html

  • Replaced ~185 lines of imperative createElement/appendChild calls with
    ~65 lines of declarative innerHTML template literals
  • Converted FS and FScale classes to plain object literals for simpler
    data representation
  • Fixed weak scaling section: removed duplicate label rendering and
    ensured SVG images display correctly
  • Removed onHTML wrapper function and replaced with standard
    DOMContentLoaded event listener
  • Simplified GitHub API calls using promise chains instead of custom
    wrapper functions
  • Removed commented-out HTML template block that was no longer needed
+65/-217

[!NOTE]
Low Risk
Static documentation-page refactor with straightforward DOM rendering changes; main risk is minor client-side rendering regressions in the landing page sections.

Overview
Refactors docs/index.html to replace imperative createElement/appendChild DOM construction with template-literal innerHTML rendering for the Featured Simulations and Weak Scaling sections, and removes the now-unneeded helper classes/wrappers and commented template code.

Fixes the Weak Scaling cards so the SVG charts actually render and the label is shown once, and keeps the GitHub API fetches (latest release + contributors) but moves them into a single DOMContentLoaded handler with simpler fetch(...).then(...) flows.

Written by Cursor Bugbot for commit 14dacd80da29330fc3a96288014a2ab2fe9a1085. Configure here.


CodeAnt-AI Description

Simplify landing page scripts and restore weak-scaling charts

What Changed

  • Featured Simulations are now rendered from a simple data list and injected as HTML templates so simulation cards (image, logo, title, link icon, metadata row) appear the same but are produced by much shorter script
  • Weak Scaling section now displays its SVG charts and shows the correct label under each chart (previously images were missing and labels duplicated)
  • Release badge and contributor avatars load on page open using fetch and are injected directly into the page DOM

Impact

✅ Correct weak-scaling charts visible on the landing page
✅ Simulation cards generated from data objects on page load
✅ Contributors' avatars and latest release version appear when opening the page

đŸ’¡ Usage Guide

Checking Your Pull Request

Every time you make a pull request, our system automatically looks through it. We check for security issues, mistakes in how you're setting up your infrastructure, and common code problems. We do this to make sure your changes are solid and won't cause any trouble later.

Talking to CodeAnt AI

Got a question or need a hand with something in your pull request? You can easily get in touch with CodeAnt AI right here. Just type the following in a comment on your pull request, and replace "Your question here" with whatever you want to ask:

@codeant-ai ask: Your question here

This lets you have a chat with CodeAnt AI about your pull request, making it easier to understand and improve your code.

Example

@codeant-ai ask: Can you suggest a safer alternative to storing this secret?

Preserve Org Learnings with CodeAnt

You can record team preferences so CodeAnt AI applies them in future reviews. Reply directly to the specific CodeAnt AI suggestion (in the same thread) and replace "Your feedback here" with your input:

@codeant-ai: Your feedback here

This helps CodeAnt AI learn and adapt to your team's coding style and standards.

Example

@codeant-ai: Do not flag unused imports.

Retrigger review

Ask CodeAnt AI to review the PR again, by typing:

@codeant-ai: review

Check Your Repository Health

To analyze the health of your code repository, visit our dashboard at https://app.codeant.ai. This tool helps you identify potential issues and areas for improvement in your codebase, ensuring your repository maintains high standards of code health.

Summary by CodeRabbit

  • Refactor
    • Simplified internal rendering logic and data structure handling. The application functionality remains unchanged—simulations, scalings, release version, and contributor information continue to display as expected.