Munawwar Firoz

Munawwar Firoz

@munawwar.bsky.social

Web developer - HTML / CSS / JS, node.js, preact, vanilla JS, serverless, serverful, databases, IaC github.com/Munawwar | codepasta.com At Carriyo, Dubai, UAE

156 followers104 following922 posts

Cheap Sol / Opus makes me feel insecure about job. 1. my boss can do most of the work I do, with better understanding of clients needs than me 2. there is cheaper, younger & more energetic devs, in other countries who leveled up with ai assistant so where's my place now?

The client is a 3 MB neutralino app that uses Preact and plain CSS (BEM style) I didn't need much native capabilities. Just ability to write to a directory and OS notifications once image processing is done.

Most background removal tools don't retain natural shadow. I figured out how to retain it. And also how to align them shoes to be perfectly 10% away from the bottom,left,right edges within a 2048x2048 canvas (allowing the shadows to occupy that 10% margin)

Pepper v0.3 component rendering work in-progress. Right now updating something at lower level of component tree bubbles changes to the top. Might make this more efficient.

Improved that. Also added a Svelte inspired context api as well. v0.2 already had a Store and different way to wire that up, but with the new component model had to reinvent it.

Pepper v0.3 component rendering work in-progress. Right now updating something at lower level of component tree bubbles changes to the top. Might make this more efficient.

I think my nimble-html fork is done here, from here onwards I need to vendor it into Pepper for integrating my component model. I added SSR, hydration, dom reconciler (for lists), spread syntax, linter, type checker, vscode extension. cc @joe.trusktr.io

Tagged template literal (TTL) based rendering library can handle spread syntax `...${props}`. I think it can have react-like `children` / slots idea too. Will be trying to (dis)prove the idea soon. Though the type checking story is weaker than what JSX can give.

Type checking story is weak because TS doesn't give the template's interpolation / hole's types to annotate it properly. If that was there then it would have been achievable.

Immediately switched to this. Remembering terminals and split panes after restart alone is awesome But I also learnt that ghostty could enable focus on mouse hover all along from Limux. And I didn't know ghostty had text search feature since March.

My fork of nimble-html has - (pseudo) hydration - dom-reconciler for lists (based off udomdiff code) - ...${prop} spread syntax - types safety isn't possible directly with TS syntax, so .. it now has TS server plugin, CLI linter tool, vscode extension (for squiggly + syntax highlight)

Munawwar Firoz@munawwar.bsky.social

Playing with nimble-html. Added (naive) hydration logic: github.com/Munawwar/nim... It doesn't aim to reduce DOM creation, but only to preserve form element states. So no CPU/Mem savings, but whatever user typed before hydration is preserved. Trade-off for lesser LoC. cc @joe.trusktr.io

Munawwar Firoz reposted

So here's an interesting little thing or 2 @nomster.bsky.social , @foolip.org , and myself have been cooking up—along with lots of help from others!: developer.chrome.com/blog/declara... This could lead to some VERY interesting changes in how we write web pages. Would love to hear your thoughts!

developer.chrome.comDeclarative partial updates  |  Blog  |  Chrome for DevelopersLearn about new out-of-order streaming capabilities and the renewed HTML insertion and streaming methods available for testing from Chrome 148

Playing with nimble-html. Added (naive) hydration logic: github.com/Munawwar/nim... It doesn't aim to reduce DOM creation, but only to preserve form element states. So no CPU/Mem savings, but whatever user typed before hydration is preserved. Trade-off for lesser LoC. cc @joe.trusktr.io

github.comGitHub - Munawwar/nimble-html at pseudo-hydrationA light-weight `html` tagged template string function for writing declarative-reactive web apps. Zero dependencies. - Munawwar/nimble-html

I think all SSR code has to be run in a sandbox on server so that any client-side library supply chain attack won't be able to mess with the server. I understand it's breaking the point of the original idea of "isomorphic code" but that era is coming to and end.

I am learning how to contain such a thing as a maintainer. Learning about "Step Security Harden Runner", learning about GitHub cache disable, socket SAST, different privileges in CI stages. Also as consumer - lavamoat/allow-scripts, pnpms defaults, socket sfw.

Socket@socket.dev

🚨 UPDATE: Mini Shai-Hulud has crossed from @npmjs.bsky.social into @pypi.org and is still spreading. Newly confirmed compromised artifacts: @​opensearch-project/opensearch: 3.5.3, 3.6.2, 3.7.0, 3.8.0 (1.3M weekly downloads) mistralai: 2.4.6 on PyPI guardrails-ai: 0.10.1 on PyPI