Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: Justif – Knuth-Plass justification and microtypography for the web

justif.lyall.co

Post reply on HN
Print view View original

21–30 of 43 posts

Re: Show HN: Justif – Knuth-Plass justification and microtypography for the web

#21

Post by globular-toast »

lyall wrote: post #11
svat wrote: post #6

For OP: I think "Type specimen" should be the default sample text, just to get readers into the right spirit. :) For anyone else reading this: make sure you click on the "controls & metrics" at the bottom to try out all the options (such as comparing with your browser's "text-wrap: pretty"); it's really cool!

It is the default if you open the demo on a narrow screen! It has a more striking difference between browser and justif layouts at narrow widths than the Alice sample. But maybe you’re right and it should be the default for everyone.

How narrow? On my phone it defaulted to Alice.

Re: Show HN: Justif – Knuth-Plass justification and microtypography for the web

#22

Post by lyall »

jstrieb wrote: post #18

Wow, I'm seriously impressed! Questions for the author: I haven't had a chance to read the code yet, but how does this actually adjust the text? I get that it uses Knuth-Plass to calculate layout, but what does it do in CSS (or SVG?) to apply the layout to the DOM? Looks like the first commit was sometime last week, which is pretty tight turnaround for something like this. For my own sanity when reading the code (no…

The layout is done entirely in DOM. The layout engine calculates the line breaks, tracking, expansion, etc. then applies the layout using HTML spans with the appropriate attributes applied. There’s generally one span per line, but that can change for more complicated lines! I invite you to inspect the demo page in your browser’s dev console if you’re particularly curious.

And yes, I did use LLMs for the implementation, both Fable 5 and 5.6 Sol specifically. I would not have been able to achieve anywhere close to the current result unaided. My patience and expertise would’ve been exhausted long before getting anywhere especially interesting.

My philosophy with LLMs is to try to use them to achieve levels of quality and polish that would’ve been previously unreasonable. I hope this project is a demonstration of that.

Re: Show HN: Justif – Knuth-Plass justification and microtypography for the web

#23

Post by lyall »

userbinator wrote: post #19

Beware: the TeX justification algorithm is quadratic-time.

Thankfully the unit it operates on is a paragraph, not the whole body of text. Also thankfully computers are very fast these days!

I added the “Alice in Wonderland (long)” text sample to the demo as a stress test, but its paragraphs are still relatively short. I should add a sample that’s one really long paragraph and see what happens. I may need to add a bail-out after X items option if it calls for it.

Re: Show HN: Justif – Knuth-Plass justification and microtypography for the web

#24

Post by lyall »

globular-toast wrote: post #21
lyall wrote: post #11

Earlier quoted context omitted.

It is the default if you open the demo on a narrow screen! It has a more striking difference between browser and justif layouts at narrow widths than the Alice sample. But maybe you’re right and it should be the default for everyone.

How narrow? On my phone it defaulted to Alice.

It should be when the screen width is less than 456 css px with the current configuration.

Re: Show HN: Justif – Knuth-Plass justification and microtypography for the web

#27

Post by imurray »

vhwalke wrote: post #9

Follow-up, since I asked the questions above: I spent the evening running Justif against the hardest page I have: three 356px columns of 18th-century text set in IM Fell at ~17.6px with 24.3px leading. I came in curious and left planning the integration. The numbers were better than I hoped. A full ~5k-word essay justified in about 280ms, and ~36KB gzipped including the en-US patterns. And the output is the part that…

[flagged]

Re: Show HN: Justif – Knuth-Plass justification and microtypography for the web

#29

Post by lyall »

emil-lp wrote: post #28

Great work. It looks as the space in "No. 12" is too large. Is it possible to distinguish between space and sentence-end-space?

Good eye! The space in "No. 12" would traditionally get a thin space [0] in professionally typeset documents, which is smaller than the standard space used for inter-word and inter-sentence spacing.

The solution here is to fix the sample text itself to use U+202F (NARROW NO-BREAK SPACE,  ). As opposed to the standard width no-break space it currently has for "No. 12" and "Fig. 7".

0: https://en.wikipedia.org/wiki/Thin_space

Re: Show HN: Justif – Knuth-Plass justification and microtypography for the web

#30

Post by rolandog »

emil-lp wrote: post #28

Great work. It looks as the space in "No. 12" is too large. Is it possible to distinguish between space and sentence-end-space?

The "standard" method would be to double space after the end of a sentence. This is how "filling" paragraphs works in org-mode to avoid breaking a line in the middle of an abbreviation.
Post reply on HN