Hello World


Introduction

Welcome to my blog! This is the first post, and it serves as both a greeting and a demonstration of all the features this site supports. I'll walk through math rendering, code highlighting, figures, footnotes, and more.

I've always wanted a simple, distraction-free place to write about technical topics. No JavaScript frameworks, no build steps — just static HTML, CSS, and a few lightweight scripts.1

Math Rendering

One of the things I wanted to support is mathematical notation. Using KaTeX, we can render inline math like \(E = mc^2\) seamlessly within text, as well as display equations:

$$\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n$$

Here's the quadratic formula as another example:

$$x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}$$

KaTeX renders these on the client side with excellent performance and beautiful typesetting.2

Code Highlighting

Python Example

Here's a simple Python function that computes the Fibonacci sequence:

def fibonacci(n):
    """Return the first n Fibonacci numbers."""
    fibs = [0, 1]
    for i in range(2, n):
        fibs.append(fibs[-1] + fibs[-2])
    return fibs[:n]

print(fibonacci(10))
# [0, 1, 1, 2, 3, 5, 8, 13, 21, 34]

JavaScript Example

And here's a JavaScript snippet that debounces a function call:

function debounce(fn, delay) {
  let timer;
  return function (...args) {
    clearTimeout(timer);
    timer = setTimeout(() => fn.apply(this, args), delay);
  };
}

const handleResize = debounce(() => {
  console.log('Window resized');
}, 250);

Figures and Images

Figures can be included with captions. Here's a placeholder demonstrating the layout:

Placeholder figure
Figure 1: A placeholder image demonstrating the figure and caption layout used throughout this blog.

Lists and Formatting

Here are some things I plan to write about:

  • Systems programming and performance optimization
  • Machine learning and neural network architectures
  • Web development with minimal tooling
  • Mathematics and algorithms

Inline code also renders nicely within body text, making it easy to reference variables like fibonacci(n) or file paths like styles/article.css.

Conclusion

That covers the main features of this blog. The entire site is static HTML with no build system — just edit, commit, and push. If you're reading this, the deployment worked!

Stay tuned for more posts. I'm looking forward to writing here.


  1. The entire site is inspired by the Distill journal's clean aesthetic.
  2. KaTeX is a fast, self-contained math typesetting library created by Khan Academy. See reference [1].

References

  1. [1] Khan Academy, "KaTeX — The fastest math typesetting library for the web," 2024.
  2. [2] Lea Verou, "Prism.js — Lightweight, extensible syntax highlighter," 2023.
  3. [3] Distill, "Distill — A machine learning journal," distill.pub, 2021.