I'm highly interested in approaches that utilize web grain in a balanced practical way. Do you have a framework/toolbelt or example sites to share? Would love to see.

If you're interested in my approach to custom elements I created: https://github.com/crisdosaygo/good.html

It utlizes custom elements, has autohooks for granular DOM updates, uses native JS template literal syntax for interpolation, imposes ordered component structure:

  .
  ├── package.json
  └── src
      ├── app.js
      └── components
          ├── app-content
          │   ├── markup.html
          │   ├── script.js
          │   └── styles.css
          └── app-header
              ├── markup.html
              ├── script.js
              └── styles.css

It even has a bit of a "comment node" hack to let you write "self-closing custom elements"

  <!app-header />

Good.HTML is the ride-or-die framework for BrowserBox.