iiinova — where your digital self keeps evolving

khanglol @khanglol.bsky.social · 04/09/2026

I'm really am trying to make it work, but part of me wished I tracked my expenses and other crap with some self-made web app :P That way I don't need some weird workarounds, and I'll be able improve my own user experience with better UI components

000

khanglol @khanglol.bsky.social · 04/09/2026

Also, Pivot Tables can't update automatically, the alternative of which requires a giant static table with a filter applied to hide broken data :/

100

khanglol @khanglol.bsky.social · 04/09/2026

Apple Numbers is so close to being usable. But not having some sort of Power Query equivalent is really annoying, makes me have to do more steps than I would want to update/add data

120

khanglol @khanglol.bsky.social · 03/09/2026

These broken ads on MacRumors making me think my screen has dead pixels🙄

000

khanglol @khanglol.bsky.social · 02/09/2026

As far as I can tell, the only things wrong are technical issues such as slight misalignments and weird padding. The "artstyle" of the site itself is fine

000

khanglol @khanglol.bsky.social · 02/09/2026

Fable 5.1 with Design Skill created the first AI designed website that I have nothing too bad to say about! Though, the copywriting is a bit cringe/wrong at a few parts. And I do not like the other 4 designs it made (some of which have good but poorly-executed ideas) www.whichai.dev/with-design-...

whichai.dev

Which AI Made This?

Compare AI-generated UIs from the same prompt across models, with and without a frontend design skill.

200

khanglol @khanglol.bsky.social · 02/09/2026

This stretching behavior is the default for all direct children of a flexbox (not grandchildren, though; the flex layout mode, like grid aswell, only affects the first layer of elements)

120

khanglol @khanglol.bsky.social · 02/09/2026

I imagine this is your DOM: ```html <div> <button>...</button> <img width="..." height="..."> <span><a ...>...</a></span> ... </div> ``` <img> has definite size, so it doesn't stretch. The links aren't stretching, because it's their parent <span> that is

120

khanglol @khanglol.bsky.social · 02/09/2026

This looks like a flexbox, so add `align-self: baseline;` on the items if you don't want them to stretch (which is the default behavior as far as I know on all browsers). This doesn't seem like a Safari problem?

120

khanglol @khanglol.bsky.social · 27/08/2026

TIL opening a PDF file in Google Drive consumes 1 GB of ram

Process Name: https://drive.google.com
Memory Usage: 1,022.4 MB

000

khanglol @khanglol.bsky.social · 14/08/2026

<menu>, which is literally a fancy <ul>

030

khanglol @khanglol.bsky.social · 13/08/2026

Hmm... It's a bit hard to explain, this is what I'm looking for:

100

khanglol @khanglol.bsky.social · 13/08/2026

Ex: For a `@media` query I may want to only visually hide a piece of text to optimize readability on mobile. Having a global visuallyhidden class is not ideal as I said with utility classes and MediaQuery(), and having to repeat the declarations makes my file unnecessarily longer

100

khanglol @khanglol.bsky.social · 13/08/2026

Yeah, that's what I had to do What I mean with composability is similar to the planned `@macro` and `@mixin` in CSS (being able to reuse the same set of styles with maybe alterations based on parameters). Without it, I end up repeating the same declarations within a file and across files too

100

khanglol @khanglol.bsky.social · 13/08/2026

It's much faster than using a Find-in-File tool because (1) I need to type the query (2) multiple things can match the same query, wasting my time

000

khanglol @khanglol.bsky.social · 13/08/2026

Last one: I sometimes find myself on autopilot aimlessly scrolling trying to find a style pertaining to a class With an actual styling solution like PandaCSS, I can Command-Click on a variable and instantly hop to the exact, relevant CSS. This is an incredible time & flow-state saver!

200

khanglol @khanglol.bsky.social · 13/08/2026

These problems makes Svelte feel archaic to me Why keep the DOM and Styles independent when they're not remotely independent of each other (at least as it pertains to Developer Experience)?

100

khanglol @khanglol.bsky.social · 13/08/2026

On another issue, having to come up and keep track of classnames is annoying too. Yes, maybe I should try using tagnames, but they're not particularly good for readability (need to scroll up to remember their purpose & semantics)

200

khanglol @khanglol.bsky.social · 13/08/2026

Surely, it being miserable to do creative layouts is not ideal?

100

khanglol @khanglol.bsky.social · 13/08/2026

Ex: Imagine on Desktop, I use a long vertical navbar. On tablet I switch it to be horizontal with accordions. Then on a phone, I put the navigation links inside a hamburger menu. How Svelte's CSS works today makes it quite impossible to factor things out, because stuff needs to be so intertwined

200

khanglol @khanglol.bsky.social · 13/08/2026

In addition, because I can't style children components natively, it makes splitting my large component into multiple files quite hard. This is often the case when I do something creative on Desktop layout, and have to adapt the layout to the low-noise, low-width expectations of mobile screens

100

khanglol @khanglol.bsky.social · 13/08/2026

And what if I want to remove or add a utility class based on a Media Query without using MediaQuery()? MediaQuery.current only evaluates correctly after hydration (especially hideous on Safari), so it'll make my component slower if I use it Composability would fix these two problems

200

khanglol @khanglol.bsky.social · 13/08/2026

Besides that, not having composability is quite annoying too. I don't want to create utility classes, because I can't immediately see what has them in the <style> element; I would have to scroll up and down multiple times. I'd rather repeat myself by copy and pasting CSS so everything's one place

200

khanglol @khanglol.bsky.social · 13/08/2026

yeah, scoped styles in Svelte kind of suck. Would not use them again having encountered a ton of annoying issues

100

khanglol @khanglol.bsky.social · 12/08/2026

Oh, I forgot to mention. CotEditor isn't anywhere big enough to have stuff like a community package manager. It's quite barebones in the Dev Department in that way. You may end up having to manually write Scripts yourself to do things, which hopefully shouldn't be too time-consuming these days

010

khanglol @khanglol.bsky.social · 12/08/2026

On my Mac, I personally switched from Sublime Text to CotEditor (also open source, plus it's available for free on the App Store). I would say CotEditor tries to do everything, while Sublime Text is more developer-oriented. But, it's really hard to say which one is better; you have to test & compare

Pros:
* Most of the features from Sublime Text
* Just as quick and fast since it uses native Apple stuff
* Right Click in Finder to Open Folder via Services
* So many customizations in Settings
** An actual UI instead of JSON so they can fit so much more stuff without needing a trillion explanatory comments
** There's so much you have to try it out to know
* Supports the syntax of 50+ languages, and you can add your own custom highlighting for unsupported languages if you want
* Tabs and code splitting
* UX generally better than Sublime Text
* Integration with Apple Scripts, and Apple Intelligence (weirdly enough)
* Weekly updates and the developer quickly addresses issues in the official Github

Cons:
* Missing a few dev features, since it's trying to be more of a hybrid editor supporting richtext & code
** Doesn't really have auto-suggestions like Sublime Text
** No code minimap thing at the right
* Changes are automatically saved when you change to a different file in the same window
** This will make you lose the ability to Undo, so be careful

Note:
* Apparently, the entire development of this app is supported by one Japanese dude

130

khanglol @khanglol.bsky.social · 12/08/2026

I'm forced to use Facebook by my friends in Vietnam, but man is the clientside actual dogwater (at least for the website). Random frame drops, broken scrolling, broken UI states, textareas rejecting Vietnamese text for no reason??? What is going on at Meta Platforms

000

khanglol @khanglol.bsky.social · 12/08/2026

Apparently, <details> and multicolumn layout do not mix well in Firefox. It took me a bit to figure out why one element was mysteriously growing in size every repaint🤒 #CSS #WebDev

010

khanglol @khanglol.bsky.social · 09/08/2026

#OrionBrowser advertises itself as faster or just as fast as Safari. I tested it and its scrolling seems much jankier? I don't know what changes they made; I don't like it I also tried #WaterFox, and it seems to be running an old version of Firefox that doesn't support color-mix(); uninstalled, sry

000

khanglol @khanglol.bsky.social · 09/08/2026

Too lazy to update the copyright information in their emails I guess

OpenAI copyright 2015-2025 (this year is 2026)

100

khanglol @khanglol.bsky.social · 08/08/2026

Column layout is also about to get a lot of upgrades in the form of `column-height`, `column-wrap`, `row-gap`, `::column`. Very excited to see what will be possible in the future Also, hoping for `reading-flow` support

000

khanglol @khanglol.bsky.social · 08/08/2026

It's just that you may need `break-inside: avoid;`. And, the items are placed vertically (not ideal if LTR order matters) But, `column-count` acting like a max count is so, so good, removes the crappy `@media` boilerplate you may need for grid. I use it for layouts where it makes sense

100

khanglol @khanglol.bsky.social · 08/08/2026

#CSS #WebDev `column-width: var(--width);` and `column-count: var(--count);` replicate: display: grid-lanes; grid-template-columns: repeat(var(--count), minmax(min(100%, var(--width)), 1fr)) Except sane syntax & `column-count` acts like a "max count", which is not possible in regular grid at all🤔

100

khanglol @khanglol.bsky.social · 07/08/2026

Or maybe I should take a break and sleep more According to Screen Time, this week I spent ~12 hours on Zed working on a site. That's not that much time, right? But I usually code during midnight, so the recommendation is to change my schedule? There's a chance it's all the above. And probably is😵‍💫

000

khanglol @khanglol.bsky.social · 07/08/2026

Maybe, these things are not easy for others, but I feel unchallenged Maybe, I should do Leetcode? Not because I want to be employed or something at this moment time, but because my probably brain fog makes me feel incompetent I don't know if I should also clear my backlog of "Watch Later" maths

100

khanglol @khanglol.bsky.social · 07/08/2026

I think I'm doing work that is too trivial, watching content that is too easy. Even though I touch very modern and advanced #CSS features, their implementation are often one-liners. And despite fighting weird Compositor nonsense, the problems I solve have a somewhat straightforward path to success🤒

100

khanglol @khanglol.bsky.social · 07/08/2026

It is me or does doing design/code for long stretches time give you brainrot? No, really. Compared a few months ago when I consistently consumed a crapton of technical math videos, my brain feels very different (foggy?). It's like I lost my ability to concentrate properly on a problem

100

khanglol @khanglol.bsky.social · 07/08/2026

I wish `run-in` was a real display-outside value, because it would be helpful for components that have arbitrary children: <article> {#if has_summary} <span style="display: run-in flex;"><Icon />Summary: </span> {/if} {@render children()} </article> Probably the only use case it has #CSS #WebDev

000

khanglol @khanglol.bsky.social · 07/08/2026

Ok, I can fix it by adding a negative margin at where it looks most egregious. Super annoying, but it's not the end of the world at least

000

khanglol @khanglol.bsky.social · 07/08/2026

The browser-provided sans-serif font is ever so slightly off-center in Gecko/Firefox, but I want to use it for performance reasons ughhhhhh. The text-box there includes the descender, but in Chrome & Safari it is trimmed to the alphabet🤒 #CSS #Frontend #WebDev

100

khanglol @khanglol.bsky.social · 07/08/2026

This textarea in Claude's settings menu causes the entire page to repaint two times every few seconds🤒 #CSS #WebDev #Frontend I guess CSS is harder than PhD-level math problems...

000

khanglol @khanglol.bsky.social · 07/08/2026

I optimized my crap so much that it incurs 2x less memory on the CPU as well as 2x less memory on the GPU than a Google Search page😊 Though, I do use more complicated effects, so the CPU load can reach significantly higher than a Google page, but it's normally just as smooth and that counts I think

000

khanglol @khanglol.bsky.social · 07/08/2026

Dumbest trick I've ever employed, but putting the background-color and border-radius on a `position: absolute; inset: 0;` ::before element saves ~20mb on the compositor

100

khanglol @khanglol.bsky.social · 07/08/2026

Interestingly, Safari doesn't have this weird layer but the compositor still uses a similar amount of memory footprint

000

khanglol @khanglol.bsky.social · 07/08/2026

It seems to appear for various random reasons It's either because of an element having sticky positioning or because of `will-change` I can consistently remove it by deleting border-radius on the <main> element. But I don't want to do that. Should I fake the rounding using pseudo-elements??

200

khanglol @khanglol.bsky.social · 07/08/2026

Does anyone know why in Chrome a giant, solid color internal layer with the highest z-index (but painted close last) covering the entire page appears? It accounts for like half of the compositor's resources🤒 It's the only thing I don't understand being promoted #CSS #WebDev #FrontEnd

100

khanglol @khanglol.bsky.social · 06/08/2026

This works even if <button> has `display: contents;` Wow!

010

Reposted by khanglol

khanglol @khanglol.bsky.social · 06/08/2026

Wait, this is so interesting thanks to <button> being a form control. Some behavior only possible with :has(:has()) may be possible using this... wow! <object> & <fieldset> don't seem to work with this even though it is a "labelable" form control according to MDN

231