This example visualizes the structure of MQTT protocol packets using a hex viewer paired with a hierarchical tree view. It shows how the raw binary data is parsed into protocol fields—such as packet type, QoS, topic, and header properties—through a Kaitai Struct format. The visualization highlights the relationship between individual bytes and their semantic meaning, with color-coded regions mapping directly to the parsed fields. The code uses Kaitai Struct’s compiled parser to decode the data and displays the resulting type hierarchy alongside the raw bytes.