add readme for hf spaces

.gitignore

@@ -19,8 +19,10 @@ venv/
 .idea/
 
 # Claude Code
+.claude/
 claude/
 
 # Gradio
+.gradio/
 gradio_cached_examples/
 flagged/

.gradio/certificate.pem

@@ -1,31 +0,0 @@
------BEGIN CERTIFICATE-----
-MIIFazCCA1OgAwIBAgIRAIIQz7DSQONZRGPgu2OCiwAwDQYJKoZIhvcNAQELBQAw
-TzELMAkGA1UEBhMCVVMxKTAnBgNVBAoTIEludGVybmV0IFNlY3VyaXR5IFJlc2Vh
-cmNoIEdyb3VwMRUwEwYDVQQDEwxJU1JHIFJvb3QgWDEwHhcNMTUwNjA0MTEwNDM4
-WhcNMzUwNjA0MTEwNDM4WjBPMQswCQYDVQQGEwJVUzEpMCcGA1UEChMgSW50ZXJu
-ZXQgU2VjdXJpdHkgUmVzZWFyY2ggR3JvdXAxFTATBgNVBAMTDElTUkcgUm9vdCBY
-MTCCAiIwDQYJKoZIhvcNAQEBBQADggIPADCCAgoCggIBAK3oJHP0FDfzm54rVygc
-h77ct984kIxuPOZXoHj3dcKi/vVqbvYATyjb3miGbESTtrFj/RQSa78f0uoxmyF+
-0TM8ukj13Xnfs7j/EvEhmkvBioZxaUpmZmyPfjxwv60pIgbz5MDmgK7iS4+3mX6U
-A5/TR5d8mUgjU+g4rk8Kb4Mu0UlXjIB0ttov0DiNewNwIRt18jA8+o+u3dpjq+sW
-T8KOEUt+zwvo/7V3LvSye0rgTBIlDHCNAymg4VMk7BPZ7hm/ELNKjD+Jo2FR3qyH
-B5T0Y3HsLuJvW5iB4YlcNHlsdu87kGJ55tukmi8mxdAQ4Q7e2RCOFvu396j3x+UC
-B5iPNgiV5+I3lg02dZ77DnKxHZu8A/lJBdiB3QW0KtZB6awBdpUKD9jf1b0SHzUv
-KBds0pjBqAlkd25HN7rOrFleaJ1/ctaJxQZBKT5ZPt0m9STJEadao0xAH0ahmbWn
-OlFuhjuefXKnEgV4We0+UXgVCwOPjdAvBbI+e0ocS3MFEvzG6uBQE3xDk3SzynTn
-jh8BCNAw1FtxNrQHusEwMFxIt4I7mKZ9YIqioymCzLq9gwQbooMDQaHWBfEbwrbw
-qHyGO0aoSCqI3Haadr8faqU9GY/rOPNk3sgrDQoo//fb4hVC1CLQJ13hef4Y53CI
-rU7m2Ys6xt0nUW7/vGT1M0NPAgMBAAGjQjBAMA4GA1UdDwEB/wQEAwIBBjAPBgNV
-HRMBAf8EBTADAQH/MB0GA1UdDgQWBBR5tFnme7bl5AFzgAiIyBpY9umbbjANBgkq
-hkiG9w0BAQsFAAOCAgEAVR9YqbyyqFDQDLHYGmkgJykIrGF1XIpu+ILlaS/V9lZL
-ubhzEFnTIZd+50xx+7LSYK05qAvqFyFWhfFQDlnrzuBZ6brJFe+GnY+EgPbk6ZGQ
-3BebYhtF8GaV0nxvwuo77x/Py9auJ/GpsMiu/X1+mvoiBOv/2X/qkSsisRcOj/KK
-NFtY2PwByVS5uCbMiogziUwthDyC3+6WVwW6LLv3xLfHTjuCvjHIInNzktHCgKQ5
-ORAzI4JMPJ+GslWYHb4phowim57iaztXOoJwTdwJx4nLCgdNbOhdjsnvzqvHu7Ur
-TkXWStAmzOVyyghqpZXjFaH3pO3JLF+l+/+sKAIuvtd7u+Nxe5AW0wdeRlN8NwdC
-jNPElpzVmbUq4JUagEiuTDkHzsxHpFKVK7q4+63SM1N95R1NbdWhscdCb+ZAJzVc
-oyi3B43njTOQ5yOf+1CceWxG1bQVs5ZufpsMljq4Ui0/1lvh+wjChP4kqKOJ2qxq
-4RgqsahDYVvTH9w7jXbyLeiNdd8XM2w9U/t7y0Ff/9yi0GE44Za4rF2LN9d11TPA
-mRGunUHBcnWEvgJBQl9nJEiU0Zsnvgc/ubhPgXRR4Xq37Z0j4r7g1SgEEzwxA57d
-emyPxgcYxn/eR44/KJ4EBs+lVDR3veyJm+kXQ99b21/+jh5Xos1AnX5iItreGCc=
------END CERTIFICATE-----

README.md

@@ -0,0 +1,6 @@
+title: LLM Training Memory Visualizer
+emoji: 🧮
+app_file: app.py
+pinned: True
+sdk: gradio
+sdk_version: 5.47.1

app.py

@@ -5,7 +5,7 @@ import gradio as gr
 import pandas as pd
 from functools import partial
 from defaults import DEFAULTS
-from details import DETAILS
+from details import DETAILS, INSTRUCTIONS
 from state import Model, Parallelism, Training
 from calculator import MemoryCalculation
 from dtypes import DType
@@ -233,19 +233,11 @@ def calculate(tp, pp, cp, ep, fsdp_enabled, fsdp_parallelism, fsdp_strategy, lay
 
     memory_data = pd.DataFrame(individual_data)
 
-    color_map = {
-        'Parameter': '#C2A9CE',   
-        'Gradient': '#AADB86',  
-        'Optimizer': '#F79090',  
-        'Activation': '#9EC7DD', 
-    }
-
     return gr.BarPlot(
         value=memory_data,
         x="Component",
         y="Memory (GB)",
         color="Type",
-        color_map=color_map,
         title="LLM Memory Usage Breakdown",
         container=False,
         y_lim=[0, None],
@@ -276,17 +268,12 @@ css = """
 }
 """
 
-with gr.Blocks(theme='Base', css=css) as demo:
+with gr.Blocks(theme='Default', css=css) as demo:
     with gr.Column():
         gr.Markdown("# LLM Training Memory Visualizer")
-        gr.Markdown(
-            """
-            ## How to Use
-            1. Use Presets OR Adjust the parallelism, model, and training panels to match your run.
-            2. Press **Calculate** to refresh the memory breakdown chart.
-            3. Review the details and references below for context on the estimates.
-            """
-        )
+        gr.Markdown("<sub>🔧 Built by [Ruben Aghayan](https://www.linkedin.com/in/ruben-aghayan-37885690/)</sub>")
+        gr.Markdown("---")
+        gr.Markdown(INSTRUCTIONS)
         with gr.Row(equal_height=True):
             tp, pp, cp, ep, fsdp_enabled, fsdp_parallelism, fsdp_strategy = create_parallelism_block()
             layers, vocab, hidden, intermediate, active_experts, total_experts, is_moe, presets, weight_tied_embeddings = create_model_block()
@@ -329,5 +316,4 @@ with gr.Blocks(theme='Base', css=css) as demo:
             gr.Markdown(LIMITATIONS)
             gr.Markdown(DETAILS)
 
-
 demo.launch()

calculator.py

@@ -172,7 +172,7 @@ class MemoryCalculation:
             # Other
             embed = 0
             final_layer_out = (
-                s * b * h / cp / tp
+                s * b * h / cp / sp
             )  # both sequence and context parallelism
             final_norm = s * b * h / cp / sp
             unembed = s * b * v / cp / tp

details.py

@@ -15,4 +15,9 @@ Helpful resources used while building this:
 - [Transformer Math 101](https://blog.eleuther.ai/transformer-math/)
 """
 
-INSTRUCTIONS = """ """
+INSTRUCTIONS = """
+            ## How to Use
+            1. Use Presets OR Adjust the parallelism, model, and training panels to match your run.
+            2. Press **Calculate** to refresh the memory breakdown chart.
+            3. Review the details and references below for context on the estimates.
+            """