HW7 · A gradient step, a fit, and a digit’s DCT

JPEG (1992) compresses 8 × 8 blocks with the discrete cosine transform, the same transform this homework applies to a digit.ITU-T Recommendation T.81 (JPEG), 1992

Out Thursday November 19 · due Wednesday November 25 (the holiday stays free), 11:59 PM on Canvas · 25 points · JavaScript or Python · hub · schedule · syllabus · all homework

Read before this homework: Neural Networks and Embeddings §1 and §2 · §3, backpropagation · The Space of Images §4, the Fourier basis · §8, what JPEG keeps · §9, PSNR

What you build

Small on purpose: six days, and nothing out over Thanksgiving. First the text's tiny network by hand: one forward pass, one backward pass, one step. Then the same code trains the 12-unit network on the course's 12 wave samples. Then a digit through the discrete cosine transform: keep the lowest k × k frequencies, rebuild, and measure what was lost in decibels.

JavaScript	Python	What it computes
`forward`	`forward`	a_h = tanh(w1_h x + b1_h), f = b2 + Σ w2_h a_h.
`gradients`	`gradients`	The mean squared error over the samples and its gradient with respect to w1, b1, w2, b2, by backpropagation.
`sgdStep`	`sgd_step`	A new model, each parameter moved by −lr times its gradient.
`dct2`	`dct2`	The orthonormal 2D DCT-II of an n × n image.
`idct2Truncated`	`idct2_truncated`	The image rebuilt from the k × k low-frequency block only.
`psnr`	`psnr`	10 log₁₀(1 / MSE) for pixel values in [0, 1].

The tiny net: w1 = (1, −1), b1 = (0.5, 0.5), w2 = (0.8, −0.6), b2 = 0.1, one sample x = 0.4, y = 0.3, lr = 0.1.
The fit starts from the seeded 12-unit weights and 12 samples in data.json (the JavaScript track imports the same values from lib/skeletons/data-hw07.js).
The digit is the first 3 of the course's 2,000 digits, 20 × 20, gray in [0, 1], row-major.

The numbers a correct build reproduces

Each row is one check, run on your functions with the published inputs below. The same table appears under the scene in the runner and in the notebook's last cell.

#	Check	Expected	Tolerance	Points
1	forward on the tiny net at x = 0.4: hidden a and output f	((0.7163, 0.09967), 0.61324)	0.0001	10
2	gradients on the one sample: loss, dw1, db1, dw2, db2	(0.09812, (0.09761, -0.14886), (0.24403, -0.37215), (0.44874, 0.06244), 0.62647)	0.0001	20
3	after one sgdStep (lr 0.1): the new output f	0.48142	0.0001	10
4	12-unit net on the 12 wave samples: loss after 400 steps (lr 0.05)	0.008355	0.00001	20
5	dct2 of the digit: the first three coefficients C[0][0], C[0][1], C[1][0]	(6.85706, -1.34555, -0.04291)	0.0001	10
6	psnr of the 5 × 5 low-frequency rebuild against the digit	10.3045	0.001	15
7	psnr of the 8 × 8 low-frequency rebuild against the digit	16.5246	0.001	15

The published inputs

{
 "tiny": {
  "w1": [ 1, -1 ],
  "b1": [ 0.5, 0.5 ],
  "w2": [ 0.8, -0.6 ],
  "b2": 0.1,
  "x": 0.4,
  "y": 0.3,
  "lr": 0.1
 },
 "fit": {
  "steps": 400,
  "lr": 0.05
 },
 "dct": {
  "n": 20,
  "keep": [ 5, 8 ]
 }
}

Implement and replace

Build each function from primitives (arithmetic, tanh, cos, log10; in Python, NumPy arrays and products.) and use the engine's own helper, where one exists, only to check your result. These are off limits in your submission:

Track	Off limits
WebGL (JavaScript)	Any machine-learning or signal-processing library. Plain arrays and loops.
Python	`scipy`, `torch`, `jax` and any autodiff; `np.fft` and any DCT routine. NumPy arrays, dot and matrix products are allowed.

Getting started

WebGL track.

Get the homework starter repository (about 2 MB): git clone https://github.com/mgav-uwb/UWB-CSS-551-AU26-homework.git, or Code, then Download ZIP. It gains each homework the day it goes out; git pull fetches it.
In its root folder run python3 -m http.server 8000 and open http://localhost:8000/homework/run.html?hw=hw07.
Edit lib/skeletons/hw07.js, the only file you change, and reload: the Checks table under the scene compares your numbers with the ones below.

The unfilled skeleton runs on this site too, so you can see the page before you start. The setup, the blank page a file opened from disk gives, and how to read the Checks table are in WebGL and three.js for This Course.

Python track.

From the homework starter repository, open homework/hw07/hw07.ipynb in Jupyter or VS Code, with data.json and expected.json in the same folder.
Fill in the functions marked TODO and run all cells: the last cell prints each check with your value and the expected one.

Submitting and grading

WebGL: the one file hw07.js.
Python: the notebook hw07.ipynb, run, with the check cell's output visible.

Grading runs your functions twice: on the published inputs above and on a second set of inputs that is not published. A check earns its points only when your value is within its tolerance on both, so the numbers have to come from the math. The rubric score is the sum of the points earned, out of 100; it counts as 25 course points (the rubric score divided by 4). A submission that does not load or compile earns no check points. Name any collaborators and tools in the submission comment.

Late tokens. You have two for the quarter. Declare one in the submission comment to extend this homework by 48 hours without penalty. Without a token, late work is not accepted, and nothing is accepted after Friday, December 11.