Spaces:
Running
Running
Upload index.html with huggingface_hub
Browse files- index.html +88 -19
index.html
CHANGED
|
@@ -1,19 +1,88 @@
|
|
| 1 |
-
<!
|
| 2 |
-
<html>
|
| 3 |
-
|
| 4 |
-
|
| 5 |
-
|
| 6 |
-
|
| 7 |
-
|
| 8 |
-
|
| 9 |
-
|
| 10 |
-
|
| 11 |
-
|
| 12 |
-
|
| 13 |
-
|
| 14 |
-
|
| 15 |
-
|
| 16 |
-
|
| 17 |
-
|
| 18 |
-
|
| 19 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="utf-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
| 6 |
+
<title>LLaMA 3.2 3B + QLoRA — Python code generation</title>
|
| 7 |
+
<style>
|
| 8 |
+
:root { --bg:#0f0f11; --panel:#18181b; --border:#2a2a2f; --fg:#e4e4e7; --mut:#a1a1aa; --acc:#4ade80; --warn:#fbbf24; }
|
| 9 |
+
* { box-sizing:border-box; }
|
| 10 |
+
body { margin:0; padding:2rem 1.5rem; background:var(--bg); color:var(--fg);
|
| 11 |
+
font-family:ui-sans-serif,system-ui,-apple-system,sans-serif; line-height:1.6; }
|
| 12 |
+
.wrap { max-width:1100px; margin:0 auto; }
|
| 13 |
+
h1 { font-size:1.5rem; font-weight:600; margin:0 0 .5rem; }
|
| 14 |
+
.sub { color:var(--mut); margin:0 0 1.5rem; }
|
| 15 |
+
.stat { display:inline-block; background:var(--panel); border:1px solid var(--border);
|
| 16 |
+
border-radius:8px; padding:.6rem 1rem; margin:0 .5rem .5rem 0; font-size:.9rem; }
|
| 17 |
+
.stat b { color:var(--acc); }
|
| 18 |
+
select { width:100%; padding:.7rem; background:var(--panel); color:var(--fg);
|
| 19 |
+
border:1px solid var(--border); border-radius:8px; font-size:1rem; margin:1rem 0; }
|
| 20 |
+
.cols { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
|
| 21 |
+
@media(max-width:820px){ .cols{ grid-template-columns:1fr; } }
|
| 22 |
+
.col h3 { font-size:.85rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em;
|
| 23 |
+
color:var(--mut); margin:0 0 .5rem; }
|
| 24 |
+
.col h3 .tag { font-size:.7rem; padding:.15rem .4rem; border-radius:4px; margin-left:.4rem;
|
| 25 |
+
text-transform:none; letter-spacing:0; }
|
| 26 |
+
.bad { background:#3f1d1d; color:#fca5a5; }
|
| 27 |
+
.good { background:#14532d; color:#86efac; }
|
| 28 |
+
pre { background:var(--panel); border:1px solid var(--border); border-radius:8px;
|
| 29 |
+
padding:1rem; overflow-x:auto; font-size:.82rem; line-height:1.5;
|
| 30 |
+
font-family:ui-monospace,SFMono-Regular,Menlo,monospace; margin:0; white-space:pre; }
|
| 31 |
+
.note { color:var(--mut); font-size:.85rem; margin-top:1.5rem; padding-top:1.5rem;
|
| 32 |
+
border-top:1px solid var(--border); }
|
| 33 |
+
a { color:var(--acc); }
|
| 34 |
+
</style>
|
| 35 |
+
</head>
|
| 36 |
+
<body>
|
| 37 |
+
<div class="wrap">
|
| 38 |
+
<h1>Python code generation — LLaMA 3.2 3B + QLoRA</h1>
|
| 39 |
+
<p class="sub">A 9.2M-parameter LoRA adapter (0.285% of the model), trained in 1.88 hours on a free T4.</p>
|
| 40 |
+
|
| 41 |
+
<div>
|
| 42 |
+
<span class="stat">HumanEval pass@1 <b>40.5% → 54.1%</b></span>
|
| 43 |
+
<span class="stat">Valid Python <b>57.5% → 100%</b></span>
|
| 44 |
+
<span class="stat">Peak VRAM <b>4.17 GB</b></span>
|
| 45 |
+
</div>
|
| 46 |
+
|
| 47 |
+
<p class="sub">The base model writes correct code — it just writes it in JavaScript
|
| 48 |
+
about 40% of the time, wrapped in markdown fences. Pick a prompt:</p>
|
| 49 |
+
|
| 50 |
+
<select id="sel"></select>
|
| 51 |
+
|
| 52 |
+
<div class="cols">
|
| 53 |
+
<div class="col">
|
| 54 |
+
<h3>Base LLaMA 3.2 3B <span class="tag bad" id="btag"></span></h3>
|
| 55 |
+
<pre id="base"></pre>
|
| 56 |
+
</div>
|
| 57 |
+
<div class="col">
|
| 58 |
+
<h3>Fine-tuned <span class="tag good">this adapter</span></h3>
|
| 59 |
+
<pre id="ft"></pre>
|
| 60 |
+
</div>
|
| 61 |
+
</div>
|
| 62 |
+
|
| 63 |
+
<p class="note">
|
| 64 |
+
Outputs are pre-generated with greedy decoding, so they are deterministic and reproducible.
|
| 65 |
+
Free HuggingFace Spaces have no GPU; running a 3B model live would take roughly 60 seconds
|
| 66 |
+
per generation.<br><br>
|
| 67 |
+
Model and full evaluation:
|
| 68 |
+
<a href="https://huggingface.co/Raghul09/llama-code-gen-lora">Raghul09/llama-code-gen-lora</a>
|
| 69 |
+
</p>
|
| 70 |
+
</div>
|
| 71 |
+
|
| 72 |
+
<script>
|
| 73 |
+
const DATA = [{"instruction": "Write a function to reverse a string", "base": "```js\nfunction reverseString(str) {\n let reversed = '';\n for (let i = str.length - 1; i >= 0; i--) {\n reversed += str[i];\n }\n return reversed;\n}\n```", "ft": "def reverse_string(string):\n return string[::-1]"}, {"instruction": "Implement binary search on a sorted list", "base": "```java\npublic class Solution {\n public int search(int[] nums, int target) {\n int left = 0, right = nums.length - 1;\n while (left <= right) {\n int mid = left + (right - left) / 2;\n if (nums[mid] == target) {\n return mid;\n } else if (nums[mid] > target) {\n right = mid - 1;\n } else {\n left = mid + 1;\n }\n }\n return -1;\n }\n}\n```", "ft": "def binary_search(arr, target):\n low = 0\n high = len(arr) - 1\n\n while low <= high:\n mid = (low + high) // 2\n if arr[mid] == target:\n return mid\n elif arr[mid] < target:\n low = mid + 1\n else:\n high = mid - 1\n return -1"}, {"instruction": "Create a function that flattens a nested list", "base": "```js\nfunction flatten(list) {\n return list.reduce((acc, item) => {\n if (Array.isArray(item)) {\n return acc.concat(flatten(item));\n }\n return acc.concat(item);\n }, []);\n}\n```", "ft": "def flatten_list(nested_list):\n flat_list = []\n for item in nested_list:\n if isinstance(item, list):\n flat_list.extend(flatten_list(item))\n else:\n flat_list.append(item)\n return flat_list"}, {"instruction": "Write a function to count word frequency in a string", "base": "```python\ndef word_frequency(string):\n word_count = {}\n for word in string.split():\n if word in word_count:\n word_count[word] += 1\n else:\n word_count[word] = 1\n return word_count\n```", "ft": "def count_words(string):\n words = string.split()\n word_freq = {}\n for word in words:\n if word in word_freq:\n word_freq[word] += 1\n else:\n word_freq[word] = 1\n return word_freq"}, {"instruction": "Write a decorator that measures execution time", "base": "```python\ndef timeit(func):\n def wrapper(*args, **kwargs):\n start = time.time()\n result = func(*args, **kwargs)\n end = time.time()\n print(f\"Function {func.__name__} took {end - start} seconds to execute\")\n return result\n return wrapper\n```", "ft": "import time\n\ndef timeit(func):\n def wrapper(*args, **kwargs):\n start = time.time()\n result = func(*args, **kwargs)\n end = time.time()\n print(\"Execution time: {} seconds\".format(end-start))\n return result\n return wrapper"}, {"instruction": "Write a function to check if two strings are anagrams", "base": "```python\ndef is_anagram(s1, s2):\n if len(s1) != len(s2):\n return False\n s1 = sorted(s1)\n s2 = sorted(s2)\n return s1 == s2\n```", "ft": "def is_anagram(str1, str2):\n if len(str1) != len(str2):\n return False\n else:\n str1 = sorted(str1)\n str2 = sorted(str2)\n if str1 == str2:\n return True\n else:\n return False"}, {"instruction": "Implement a stack class with push, pop, and peek", "base": "```java\npublic class Stack {\n private int[] stack;\n private int top;\n private int size;\n\n public Stack(int size) {\n this.stack = new int[size];\n this.top = -1;\n this.size = size;\n }\n\n public void push(int value) {\n if (top == size - 1) {\n System.out.println(\"Stack is full\");\n return;\n }\n top++;\n stack[top] = value;\n }\n\n public int pop() {\n if (top == -1) {\n System.out.println(\"Stack is empty\");\n return -1;\n }\n int value = stack[top];\n top--;\n return value;\n }\n\n public int peek() {\n if (top == -1) {\n System.out.println(\"Stack is empty\");\n return -1;\n }\n return stack[top];\n }\n}\n```", "ft": "class Stack:\n def __init__(self):\n self.stack = []\n\n def push(self, item):\n self.stack.append(item)\n\n def pop(self):\n return self.stack.pop()\n\n def peek(self):\n return self.stack[-1]"}, {"instruction": "Write a function that returns the nth Fibonacci number", "base": "```python\ndef fib(n):\n if n == 0:\n return 0\n if n == 1:\n return 1\n return fib(n-1) + fib(n-2)\n```", "ft": "def fibonacci(n):\n if n == 0:\n return 0\n elif n == 1:\n return 1\n else:\n return fibonacci(n-1) + fibonacci(n-2)"}];
|
| 74 |
+
const sel = document.getElementById('sel');
|
| 75 |
+
DATA.forEach((d,i) => { const o=document.createElement('option'); o.value=i; o.textContent=d.instruction; sel.appendChild(o); });
|
| 76 |
+
function render(){
|
| 77 |
+
const d = DATA[sel.value];
|
| 78 |
+
document.getElementById('base').textContent = d.base;
|
| 79 |
+
document.getElementById('ft').textContent = d.ft;
|
| 80 |
+
const isPy = !/^```(js|javascript|java)/.test(d.base.trim()) && !/\bfunction\s+\w+\s*\(/.test(d.base);
|
| 81 |
+
const t = document.getElementById('btag');
|
| 82 |
+
t.textContent = isPy ? 'markdown-fenced' : 'wrong language';
|
| 83 |
+
}
|
| 84 |
+
sel.addEventListener('change', render);
|
| 85 |
+
render();
|
| 86 |
+
</script>
|
| 87 |
+
</body>
|
| 88 |
+
</html>
|