[{"data":1,"prerenderedAt":536},["ShallowReactive",2],{"project-31595822":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":46,"post_text":47,"what":48,"said":76,"maker_in_thread":241,"shape":247,"grid":250,"attempts":497,"same_week":498,"maker_shows":38,"maker_hidden":528,"reader_version":529,"card":530},"31595822","Svelvet","A component library for building interactive flow diagrams","title","Show HN: Svelvet – A component library for building interactive flow diagrams","https:\u002F\u002Fsvelvet.io\u002F","svelvet.io","awillettnyc",1654182556,2022,354,91,106,2570,5,"legend","dev_tools","ui component library","library",[24,25,26,27],"svelte","flow diagram","node editor","svelte component library","mixed",-0.129,{"positive":31,"neutral":32,"mixed":33,"critical":34},9,25,2,15,51,{"docs":37,"idea":40,"performance":41,"design":43,"execution":44},{"positive":38,"critical":39},1,3,{"positive":33,"critical":18},{"positive":38,"critical":42},4,{"positive":33,"critical":38},{"positive":45,"critical":38},0,[39,18,39,38,45,38,38,42,45,18,18,39,39,39,38,18,45,18,18,39,45,38,39,18,45,39,45,39,39,39,38,38,38,39,45,38,38,38,38,38],null,{"problem":49,"audience":56,"pricing":47,"motivation":64,"time_to_build":47,"stack":68,"openness":73,"stage":74,"team_size":75},{"value":50,"source":51,"evidence":52},"Building interactive node-based flow diagrams in Svelte","maker",[53],{"id":54,"by":11,"text":55},"31595823","Launch day is here! Our team is proud to present our open source product, Svelvet is a lightweight Svelte component library for building interactive node-based flow diagrams.…",{"value":57,"source":58,"evidence":59},"Svelte developers","commenter",[60],{"id":61,"by":62,"text":63},"31603055","anulepau","this is a 100% an open source product developed under tech accelerator OSLabs! :) we noticed svelte developers requesting a library like this, so we built it to try to fill that…",{"value":65,"source":58,"evidence":66},"Svelte developers requested a library like this, so the team built it to fill that need",[67],{"id":61,"by":62,"text":63},[69],{"value":70,"source":51,"evidence":71},"Svelte",[72],{"id":54,"by":11,"text":55},"open_source","launched","team",{"praise":77,"objections":104,"requests":152,"questions":181,"alternatives":200},[78,93],{"value":79,"source":58,"evidence":80},"Clean look and feel of the demo",[81,85,89],{"id":82,"by":83,"text":84},"31599623","yoda97","So clean! love it.",{"id":86,"by":87,"text":88},"31599649","upupandup","Not to detract this component but I can say with certainty that people will be writing Desktop applications with Svelte\u002FReact running inside Electron that takes up gigs of ram.…",{"id":90,"by":91,"text":92},"31597214","ravenstine","Oh man, I could have really used something like this 4 years ago. I was doing a personal project that would have involved a node graph UI, and it was actually kind of challenging…",{"value":94,"source":58,"evidence":95},"Fills a gap for Svelte developers needing node diagrams",[96,100],{"id":97,"by":98,"text":99},"31596446","bennyp101","Seems to be - which is cool, Im a fan of Svelte so more community investment is great! \"Svelvet is an open source Svelte component library which seeks to port React Flow…",{"id":101,"by":102,"text":103},"31598585","DonHopkins","Very nice! I love Svelte, and reading code like this is a great way to learn how to use it better. Has anybody made a customizable JSON tree editor \u002F browser for Svelte?…",[105,124,135,145],{"value":106,"source":58,"evidence":107},"Slow or laggy performance, especially on mobile and in some browsers",[108,112,116,120],{"id":109,"by":110,"text":111},"31597094","Philip-J-Fry","The performance on my S21 Ultra is pretty bad. Feels like ~40fps and stuttering. Also, it doesn't have mobile interaction for dragging nodes. I can only pan the canvas.",{"id":113,"by":114,"text":115},"31597352","jspaetzel","Beautiful, but so so slow. I wouldn't call this lightweight.",{"id":117,"by":118,"text":119},"31596455","welder","The page causes my CPU to go crazy.",{"id":121,"by":122,"text":123},"31598027","a2128","On my phone, with Chrome Android it's smooth and fast, but on Firefox Android it feels about 20fps and isn't great.",{"value":125,"source":58,"evidence":126},"No mobile node dragging, only panning",[127,128,132],{"id":109,"by":110,"text":111},{"id":129,"by":130,"text":131},"31596447","whiddershins","This is so great. How hard would\u002Fwill it be to make the nodes draggable? Edit: maybe it already does this but it is hard to interact with on the phone. Edit2: can’t move them on…",{"id":133,"by":62,"text":134},"31600170","hi, thank you for this suggestion! We noticed the same issue during development and we definitely have it listed as a feature we'd like to add on. :) I do not believe that…",{"value":136,"source":58,"evidence":137},"Confusing name that is close to Svelte",[138,142],{"id":139,"by":140,"text":141},"31597627","bmitc","Why was such a confusing name chosen? Even the Hacker News title already gets it wrong. Just think how many times this will cause confusion that wastes time being clarified.",{"id":143,"by":140,"text":144},"31599314","I agree on the title editing, which I in general dislike, especially when no comment is left. But I disagree that this isn't confusing. Imagine the conversation: ``` Dev1: Says…",{"value":146,"source":58,"evidence":147},"Page requires JavaScript to show anything",[148],{"id":149,"by":150,"text":151},"31596248","photochemsyn","Too bad the page requires Javascript to view. This trend is not conducive to expanding engagement by those of us who run script blockers like NoScript as the default mode. [edit:…",[153,160,167,174],{"value":154,"source":58,"evidence":155},"Static image export such as SVG",[156],{"id":157,"by":158,"text":159},"31596376","johnm","Nice! Would be great if it could generate static images of a diagram in e.g. SVG.",{"value":161,"source":58,"evidence":162},"Multi-select and move of nodes",[163],{"id":164,"by":165,"text":166},"31599040","pitaj","Is there a way to select and move multiple nodes at once?",{"value":168,"source":58,"evidence":169},"Snapping and helper lines for alignment",[170],{"id":171,"by":172,"text":173},"31598460","zelphirkalt","It would be great to have some more helper lines when dragging things aroung and some optional snapping to the helper lines, to be able to properly align everything. I often use…",{"value":175,"source":58,"evidence":176},"Import of DOT data",[177],{"id":178,"by":179,"text":180},"31666083","greyhair","Can it import DOT data? I have too many graphviz tools to just abandon dot.",[182,193],{"value":183,"source":58,"evidence":184},"Can nodes be positioned automatically in rows or with a layout algorithm",[185,189],{"id":186,"by":187,"text":188},"31598282","nrabulinski","Looks very good! I haven’t read all the documentation but I haven’t seen it so I’ll ask here: is it possible to automatically position the nodes in rows? Or are there APIs which…",{"id":190,"by":191,"text":192},"31601294","tunesmith","What's the layout library? elkjs?",{"value":194,"source":58,"evidence":195},"Support for named ports on nodes",[196],{"id":197,"by":198,"text":199},"31616478","airbreather","Appears to have no named ports on nodes, key feature for many uses in my domain.",[201,216,227,234],{"value":202,"source":58,"evidence":203},"React Flow",[204,208,212],{"id":205,"by":206,"text":207},"31596149","simonbarker87","Nice, so React Flow for Svelte?",{"id":209,"by":210,"text":211},"31600156","robertlagrant","If you're on React these days ReactFlow (https:\u002F\u002Freactflow.dev) is good for this.",{"id":213,"by":214,"text":215},"31596764","steve_taylor","It’s a timely development given React Flow’s recent cash grab.",{"value":217,"source":58,"evidence":218},"Graphviz",[219,223],{"id":220,"by":221,"text":222},"31596791","encryptluks2","While I can see how point-and-clickers love things like this, I prefer building connections using markup. So things like Graphviz, PlantUML, and Mermaid appeal to me. However,…",{"id":224,"by":225,"text":226},"31599621","bee_rider","If you are going to let the program do the layout automatically, then graphviz dot already does really good, right? I think the reason people make these projects is specifically…",{"value":228,"source":58,"evidence":229},"PlantUML",[230],{"id":231,"by":232,"text":233},"31597540","manishsharan","I use PlantUML + Dropbox to share . It's not pretty but it is powerful. We make it interactive by editing the text file and saving the changes. There is also a VSCode plugin for…",{"value":235,"source":58,"evidence":236},"Cytoscape.js",[237],{"id":238,"by":239,"text":240},"31597703","lhoursquentin","> Yeah, I know there's D3.js but that involved way more knowledge and learning than I was interested in. Same, d3 looked very powerful but had a steep learning curve. I was…",{"comments":33,"answered":45,"key":242},[243,244],{"id":54,"text":55},{"id":245,"text":246},"31598117","Thanks for the advice! Do you think the mods would mind a double post?",{"commenters":248,"max_depth":18,"maker_replies":33,"first_comment_mins":45,"lifespan_hours":249},70,141,[251,253,255,259,262,266,270,274,278,281,284,286,290,293,294,296,300,302,304,308,310,312,316,318,321,323,324,326,329,330,332,333,335,340,342,345,347,348,350,351,352,353,357,359,363,365,369,371,373,376,379,381,383,385,387,391,394,396,398,401,405,406,408,413,416,420,422,425,429,430,433,434,436,438,441,446,449,451,453,457,459,463,467,469,472,475,479,483,486,490,493],[54,45,45,252,11,38],"maker\u002Fneutral\u002Fnone",[157,45,39,254,158,45],"project\u002Fneutral\u002Fnone",[256,45,18,257,258,45],"31597093","project\u002Fpositive\u002Fdocs","TIPSIO",[260,45,18,261,62,45],"31602742","maker\u002Fpositive\u002Fnone",[263,45,45,264,265,45],"31597538","other\u002Fneutral\u002Fnone","DenseComet",[267,45,39,268,269,45],"31600849","project\u002Fneutral\u002Fidea","nileshtrivedi",[271,45,45,272,273,45],"31602512","commenter\u002Fneutral\u002Fnone","NonNefarious",[275,45,38,276,277,45],"31600876","project\u002Fcritical\u002Fdocs","moklick",[279,45,45,272,280,45],"31601255","schnebbau",[282,45,45,272,283,45],"31601286","toqy",[285,45,45,264,140,45],"31603071",[287,45,38,288,289,45],"31602072","project\u002Fcritical\u002Fnone","klysm",[291,45,39,252,292,45],"31602339","NegativeLatency",[61,45,39,252,62,45],[109,38,38,295,110,45],"project\u002Fcritical\u002Fperformance",[297,38,18,298,299,45],"31597183","project\u002Fpositive\u002Fdesign","darkerside",[121,38,39,301,122,45],"project\u002Fmixed\u002Fperformance",[86,38,39,303,87,45],"project\u002Fneutral\u002Fperformance",[305,38,45,306,307,45],"31600024","commenter\u002Fneutral\u002Fperformance","iueotnmunto",[309,38,45,306,87,45],"31600681",[311,38,45,306,307,45],"31600713",[313,38,18,314,315,45],"31602892","project\u002Fpositive\u002Fperformance","jdc",[101,33,18,317,102,45],"project\u002Fpositive\u002Fnone",[319,33,45,272,320,45],"31599219","bthomas",[171,39,39,322,172,45],"project\u002Fneutral\u002Fdesign",[220,42,39,268,221,45],[224,42,45,325,225,45],"commenter\u002Fneutral\u002Fidea",[327,42,39,268,328,45],"31616827","graphviz",[129,18,39,322,130,45],[331,18,45,272,158,45],"31596508",[133,18,39,252,62,45],[334,18,45,272,130,45],"31603441",[336,337,38,338,339,45],"31607187",6,"project\u002Fcritical\u002Fidea","netsharc",[205,341,39,268,206,45],7,[343,341,39,254,344,45],"31596186","ramshorst",[97,341,18,346,98,45],"project\u002Fpositive\u002Fidea",[213,341,45,264,214,45],[231,349,45,264,232,45],8,[90,31,18,346,91,45],[238,31,45,264,239,45],[209,31,45,264,210,45],[354,355,18,317,356,45],"31596742",10,"crackinmalackin",[186,358,39,322,187,45],11,[360,361,45,264,362,45],"31598483",12,"ec109685",[178,364,39,254,179,45],13,[366,367,45,264,368,45],"31598474",14,"operantoperator",[370,367,45,264,102,45],"31598595",[372,367,45,264,140,45],"31599335",[374,34,45,264,375,45],"31596373","the_arun",[197,377,38,378,198,45],16,"project\u002Fcritical\u002Fdesign",[113,380,39,301,114,45],17,[164,382,39,322,165,45],18,[190,384,39,254,191,45],19,[82,386,18,298,83,45],20,[388,389,45,264,390,45],"31597679",21,"swyx",[392,389,45,264,393,45],"31597784","pvg",[395,389,45,264,102,45],"31598652",[397,389,45,264,393,45],"31598854",[399,389,39,252,400,45],"31599786","dang",[402,403,45,264,404,45],"31596229",22,"tobr",[245,403,45,252,11,38],[407,403,39,252,393,45],"31598315",[409,410,39,411,412,45],"31597926",23,"project\u002Fneutral\u002Fdocs","dolmen",[414,410,39,411,415,45],"31597975","adontz",[417,410,45,418,419,45],"31597998","commenter\u002Fneutral\u002Fdocs","Asraelite",[421,410,45,264,102,45],"31598664",[423,410,39,424,400,45],"31599805","maker\u002Fneutral\u002Fdocs",[426,427,39,411,428,45],"31599089",24,"mcv",[139,32,38,338,140,45],[431,32,45,272,432,45],"31597758","vlunkr",[143,32,38,338,140,45],[435,32,45,272,283,45],"31601312",[437,32,45,272,140,45],"31602716",[439,32,38,338,440,45],"31603001","coder543",[442,443,45,444,445,45],"31600555",26,"other\u002Fneutral\u002Fidea","junon",[447,443,45,264,448,45],"31600675","irq-1",[450,443,39,254,269,45],"31601027",[452,443,45,272,445,45],"31601779",[454,443,45,455,456,45],"31603301","other\u002Fneutral\u002Fdocs","skeletonjelly",[458,443,45,455,445,45],"31603892",[460,461,38,276,462,45],"31598739",27,"FunnyLookinHat",[464,465,38,276,466,45],"31598840",28,"chrisweekly",[117,468,38,295,118,45],29,[470,468,38,295,471,45],"31596678","red_trumpet",[473,468,38,295,474,45],"31604093","b0ner_t0ner",[476,477,39,411,478,45],"31598977",30,"nabeards",[480,481,38,338,482,45],"31597359",31,"Sloppy",[484,481,45,272,485,45],"31597420","jsnk",[487,488,45,264,489,45],"31597972",32,"george_ciobanu",[149,491,38,492,150,45],33,"project\u002Fcritical\u002Fexecution",[494,491,39,495,496,45],"31596274","project\u002Fneutral\u002Fexecution","datashaman",[],[499,504,509,514,519,523],{"id":500,"name":501,"points":502,"category":503},"31607318","webOS Archive",439,"infrastructure",{"id":505,"name":506,"points":507,"category":508},"31653726","The Bitcoin Note",344,"finance_crypto",{"id":510,"name":511,"points":512,"category":513},"31668814","Spiral Wiki",331,"security_privacy",{"id":515,"name":516,"points":517,"category":518},"31593726","quaxio.com",281,"games",{"id":520,"name":521,"points":522,"category":503},"31657527","Umbrel",225,{"id":524,"name":525,"points":526,"category":527},"31599603","jasm",218,"languages",false,"v2",{"id":531,"name":5,"line":6,"ai":528,"cat":20,"year":13,"points":14,"comments":15,"rec":28,"s":532,"top":18,"kw":533,"maker":11,"domain":10,"tier":19,"attempts":45,"strip":534,"url":9,"mix":535,"praise":79,"objection":106,"sub":21},31595822,-0.13,[24,25,26,27],"3531011405533315055301350303331113011111",[31,32,33,34],1794036621068]