[{"data":1,"prerenderedAt":313},["ShallowReactive",2],{"project-46488654":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":10,"maker":11,"posted_at":12,"year":13,"points":14,"comments":15,"rank_in_year":16,"shown_in_year":17,"top":18,"tier":19,"category":20,"subcategory":21,"format":22,"keywords":23,"reception":28,"sentiment":29,"stance_mix":30,"scored_comments":35,"aspects":36,"strip":43,"post_text":45,"what":46,"said":64,"maker_in_thread":170,"shape":181,"grid":185,"attempts":275,"same_week":276,"maker_shows":41,"maker_hidden":305,"reader_version":306,"card":307},"46488654","how browsers work","An interactive guide to how browsers work","title","Show HN: An interactive guide to how browsers work","https:\u002F\u002Fhowbrowserswork.com\u002F","howbrowserswork.com","krasun",1767539282,2026,302,38,146,4366,4,"legend","learning_science","interactive guide","web_app",[24,5,25,26,27],"browser internals","dom","rendering pipeline","web browser","debated",0.114,{"positive":31,"neutral":32,"mixed":33,"critical":34},8,7,0,6,21,{"docs":37,"design":40,"idea":42},{"positive":38,"critical":39},2,5,{"positive":41,"critical":41},1,{"positive":38,"critical":33},[41,33,44,39,33,33,33,33,33,39,33,33,39,33,39,33,41,33,41,44,33,39,41,33,41,44,44,33,33,44,44,44,39,33,33,41,39,39],3,null,{"problem":47,"audience":45,"pricing":45,"motivation":45,"time_to_build":45,"stack":61,"openness":62,"stage":63,"team_size":62},{"value":48,"source":49,"evidence":50},"Explains how browsers turn a URL into a rendered page","inferred",[51,53,57],{"id":52},"post",{"id":54,"by":55,"text":56},"46488907","utopiah","Neat, it's like an exciting way to dive into https:\u002F\u002Fbrowser.engineering without having anything to install. I'm wondering if examples with Browser\u002FServer could benefit from a…",{"id":58,"by":59,"text":60},"46490539","edwinjm","Bit unfortunate that more than half of the page is dedicated to network requests, but almost all work and complexity of the browser is in the parsing and rendering pipeline.",[],"unknown","beta",{"praise":65,"objections":90,"requests":124,"questions":153,"alternatives":161},[66,82],{"value":67,"source":68,"evidence":69},"Clear, interactive mental model for browser internals","commenter",[70,74,78],{"id":71,"by":72,"text":73},"46509344","A1aM0","I love the \"mental model\" approach here. Most guides I've seen either get bogged down in the minute details of TLS\u002FHandshakes immediately or are way too high-level. The…",{"id":75,"by":76,"text":77},"46489290","chrisweekly","Cool project, thanks for sharing. HN readers should also check out https:\u002F\u002Fhpbn.co (High-Performance Browser Networking) and https:\u002F\u002Fevery-layout.dev (amazing CSS resource; the…",{"id":79,"by":80,"text":81},"46492040","raghavankl","This is cool",{"value":83,"source":68,"evidence":84},"Useful for learning how browsers work, like a modern TV-electronics book",[85,89],{"id":86,"by":87,"text":88},"46489933","amelius","When I was a kid I had an electronics book about how (CRT based) TVs work. Posts like this are the modern version of that.",{"id":54,"by":55,"text":56},[91,95,106,117],{"value":92,"source":68,"evidence":93},"Network requests take up too much of the guide versus parsing and rendering",[94],{"id":58,"by":59,"text":60},{"value":96,"source":68,"evidence":97},"DOM history and terminology is inaccurate or oversimplified",[98,102],{"id":99,"by":100,"text":101},"46489912","domnodom","Not all browsers had or have a DOM, and some didn’t until later versions. Early browsers without DOMs (with initial release date): WorldWideWeb (Nexus) (Dec 1990), Erwise (Apr…",{"id":103,"by":104,"text":105},"46492027","magicalist","> Would be writing something like \"DOM in the modern browsers\" more correct then? No, I don't think so. I don't know why the GP comment is at the top beyond historical interest.…",{"value":107,"source":68,"evidence":108},"URL handling guess behavior is oversimplified",[109,113],{"id":110,"by":111,"text":112},"46490776","LoganDark","Claims that browsers transform \"d.csdfdsaf\" -> https:\u002F\u002Fd.csdfdsaf, but they don't. They only transform domains with valid TLDs, unless you manually add the URL scheme.",{"id":114,"by":115,"text":116},"46492154","myfonj","The \"guesswork\" done by browsers is actually pretty nuanced and not standardised in a slightest way. Some defaults are pretty common, and could be maybe considered de-facto…",{"value":118,"source":68,"evidence":119},"Covers only Safari and Chrome, not all browsers",[120],{"id":121,"by":122,"text":123},"46495231","GaryBluto","This doesn't account for all browsers, only Safari and Chrome. There isn't even a passing mention of separate search and address bars.",[125,135,142,149],{"value":126,"source":68,"evidence":127},"Cover rendering, layout and reflow in more detail",[128,132],{"id":129,"by":130,"text":131},"46498779","englishcat","Great project, thanks What's your next steps, do you plan to add more details of the reflow process?",{"id":133,"by":11,"text":134},"46490879","Will cover the rendering engine in more details. I didn't know at what sections to go deeper. So just stopped and published it to gather more feedback. Thank you!",{"value":136,"source":68,"evidence":137},"Explain how images, styles and scripts load",[138],{"id":139,"by":140,"text":141},"46489552","arendtio","I like it very much --> bookmarked :-) The step I am missing is how other resources (images, style sheets, scripts) are being loaded based on the HTML\u002FDOM. I find that crucial…",{"value":143,"source":68,"evidence":144},"Fix narrow-window layout where contents overlaps",[145],{"id":146,"by":147,"text":148},"46489052","philk10","For a narrow browser window (\u003C 1170) the contents section floats over the contents which is distracting",{"value":150,"source":68,"evidence":151},"Add browser\u002Fserver visual icons",[152],{"id":54,"by":55,"text":56},[154],{"value":155,"source":68,"evidence":156},"How does the DNS section account for HTTPS resource records",[157],{"id":158,"by":159,"text":160},"46493765","jeffbee","Perhaps worth editing the DNS section in light of RFC 9460 ... depending on the presence and contents of the HTTPS RR, a browser might not even use TCP. Here's a good blog post…",[162,166],{"value":163,"source":68,"evidence":164},"browser.engineering",[165],{"id":54,"by":55,"text":56},{"value":167,"source":68,"evidence":168},"High Performance Browser Networking",[169],{"id":75,"by":76,"text":77},{"comments":34,"answered":33,"key":171},[172,175,178],{"id":173,"text":174},"46490956","Thank you for the suggestion! Would be writing something like \"DOM in the modern browsers\" more correct then?",{"id":176,"text":177},"46488971","I am planning to add more sections with more details. But decided first to collect some feedback. Thank you! It is a good suggestion. Let me think about it.",{"id":179,"text":180},"46490183","I thought about this, but I tried to keep it simple. Let me figure out how to add these blocks without over-complicating the guide. Thank you!",{"commenters":182,"max_depth":39,"maker_replies":34,"first_comment_mins":183,"lifespan_hours":184},28,26,39,[186,188,190,192,196,200,204,207,209,211,213,216,219,221,223,224,225,227,230,231,233,234,236,237,239,240,243,246,248,250,254,256,258,260,264,267,269,271],[99,33,41,187,100,33],"project\u002Fcritical\u002Fdocs",[173,33,33,189,11,41],"maker\u002Fneutral\u002Fdocs",[103,33,44,191,104,33],"project\u002Fneutral\u002Fdocs",[193,33,39,194,195,33],"46497613","project\u002Fpositive\u002Fdocs","lucideer",[197,33,33,198,199,33],"46492924","commenter\u002Fneutral\u002Fnone","userbinator",[201,41,33,202,203,33],"46489569","other\u002Fneutral\u002Fnone","logicallee",[205,41,33,202,206,33],"46490408","CableNinja",[208,41,33,202,203,33],"46490606",[210,41,33,202,122,33],"46495234",[75,38,39,212,76,33],"project\u002Fpositive\u002Fnone",[214,38,33,202,215,33],"46489800","konaraddi",[217,38,33,202,218,33],"46490416","KomoD",[54,44,39,220,55,33],"project\u002Fpositive\u002Fdesign",[176,44,33,222,11,41],"maker\u002Fneutral\u002Fnone",[139,18,39,194,140,33],[179,18,33,222,11,41],[146,39,41,226,147,33],"project\u002Fcritical\u002Fdesign",[228,39,33,229,11,41],"46489317","maker\u002Fneutral\u002Fdesign",[58,34,41,187,59,33],[232,34,44,191,111,33],"46490783",[133,34,33,189,11,41],[71,32,39,235,72,33],"project\u002Fpositive\u002Fidea",[110,31,41,187,111,33],[238,31,33,189,11,41],"46491584",[114,31,41,187,115,33],[241,31,44,191,242,33],"46492163","ranger_danger",[244,31,44,191,245,33],"46493323","MarsIronPI",[247,31,33,198,242,33],"46494435",[249,31,33,198,245,33],"46501651",[251,252,44,191,253,33],"46494990",9,"schoen",[158,255,44,191,159,33],10,[129,257,44,222,130,33],11,[86,259,39,235,87,33],12,[261,262,33,202,263,33],"46496505",13,"vivzkestrel",[265,262,33,202,266,33],"46496554","webdevver",[121,268,41,187,122,33],14,[79,270,39,212,80,33],15,[272,273,39,212,274,33],"46501212",16,"henrygallen",[],[277,282,287,291,296,301],{"id":278,"name":279,"points":280,"category":281},"46454693","OpenWorkers",500,"infrastructure",{"id":283,"name":284,"points":285,"category":286},"46491749","taws",390,"dev_tools",{"id":288,"name":289,"points":290,"category":286},"46511469","Prism.Tools",380,{"id":292,"name":293,"points":294,"category":295},"46499646","DoNotNotify",347,"productivity",{"id":297,"name":298,"points":299,"category":300},"46501137","Tailsnitch",280,"security_privacy",{"id":302,"name":303,"points":304,"category":286},"46449852","Enroll",265,false,"v2",{"id":308,"name":5,"line":6,"ai":305,"cat":20,"year":13,"points":14,"comments":15,"rec":28,"s":309,"top":18,"kw":310,"maker":11,"domain":10,"tier":19,"attempts":33,"strip":311,"url":9,"mix":312,"praise":67,"objection":92,"sub":21},46488654,0.11,[24,5,25,26,27],"10350000050050501013051013300333500155",[31,32,33,34],1794036689471]