[{"data":1,"prerenderedAt":172},["ShallowReactive",2],{"project-18396165":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":29,"sentiment":30,"stance_mix":31,"scored_comments":35,"aspects":36,"strip":40,"post_text":30,"what":41,"said":63,"maker_in_thread":110,"shape":117,"grid":121,"attempts":135,"same_week":136,"maker_shows":35,"maker_hidden":165,"reader_version":166,"card":167},"18396165","bindStateToDom","A minimal function to bind state to DOM","title","Show HN: A minimal function to bind state to DOM","https:\u002F\u002Fantoinemopa.github.io\u002FbindStateToDom\u002F","antoinemopa.github.io","antoineMoPa",1541550182,2018,9,7,1895,2155,88,"shown","languages","frontend library","library",[24,25,26,27,28],"state binding","dom binding","javascript","reactive state","minimal library","quiet",null,{"positive":32,"neutral":33,"mixed":32,"critical":34},0,3,1,4,{"execution":37,"idea":38,"performance":39},{"positive":32,"critical":34},{"positive":32,"critical":32},{"positive":32,"critical":32},[32,32,33,34,33,32,33],{"problem":42,"audience":30,"pricing":30,"motivation":49,"time_to_build":30,"stack":53,"openness":62,"stage":62,"team_size":62},{"value":43,"source":44,"evidence":45},"Binding state to DOM without a render step.","maker",[46],{"id":47,"by":11,"text":48},"18399165","I hope to save on performance & memory by cutting the render step and binding immediately to dom elements (But I could be wrong, I will need benchmarks before the switch).",{"value":50,"source":44,"evidence":51},"Save performance and memory by cutting the render step and binding immediately to DOM elements.",[52],{"id":47,"by":11,"text":48},[54],{"value":55,"source":56,"evidence":57},"JavaScript","inferred",[58],{"id":59,"by":60,"text":61},"18397684","daliwali","I made something almost exactly like this: https:\u002F\u002Fsimulacra.js.org\u002F This actually uses object getters\u002Fsetters, has full support for arrays, and nested arrays of objects. There…","unknown",{"praise":64,"objections":73,"requests":88,"questions":94,"alternatives":101},[65],{"value":66,"source":67,"evidence":68},"Useful as learning material","commenter",[69],{"id":70,"by":71,"text":72},"18411398","pier25","This is great as learning material. Have you benchmarked your approach?",[74,81],{"value":75,"source":67,"evidence":76},"Consecutive clicks on number increment\u002Fdecrement buttons fail in Chrome 62",[77],{"id":78,"by":79,"text":80},"18413792","boomlinde","Consecutive clicks on the number increment\u002Fdecrement buttons don't work. Google Chrome Version 62.0.3202.75 (Official Build) (64-bit)",{"value":82,"source":67,"evidence":83},"Unclear whether it saves meaningful bandwidth versus Vue.js",[84],{"id":85,"by":86,"text":87},"18398319","dzwillia","Interesting idea! Just wondering if there are any benefits to going down this road other than saving the 21K of bandwidth necessary for Gzipped\u002Fminified Vue.js?",[89],{"value":90,"source":67,"evidence":91},"Benchmarks of performance versus existing approaches",[92,93],{"id":70,"by":71,"text":72},{"id":47,"by":11,"text":48},[95],{"value":96,"source":67,"evidence":97},"What happens if DOM nodes are moved around, does binding break?",[98],{"id":99,"by":71,"text":100},"18411386","So what happens in Simulacra if I start moving DOM nodes around? Does the binding break?",[102,106],{"value":103,"source":67,"evidence":104},"Simulacra.js",[105],{"id":59,"by":60,"text":61},{"value":107,"source":67,"evidence":108},"Vue.js",[109],{"id":85,"by":86,"text":87},{"comments":111,"answered":34,"key":112},2,[113,116],{"id":114,"text":115},"18400321","Nice! I will definitely consider this option for my next projects! Also, I am starting to think that this sort of binding could be implemented natively by browsers, which could…",{"id":47,"text":48},{"commenters":118,"max_depth":111,"maker_replies":111,"first_comment_mins":119,"lifespan_hours":120},5,454,59,[122,124,126,128,130,132,134],[59,32,32,123,60,32],"commenter\u002Fneutral\u002Fidea",[114,32,32,125,11,34],"maker\u002Fpositive\u002Fidea",[99,32,33,127,71,32],"project\u002Fneutral\u002Fexecution",[78,34,34,129,79,32],"project\u002Fcritical\u002Fexecution",[85,111,33,131,86,32],"project\u002Fneutral\u002Fidea",[47,111,32,133,11,34],"maker\u002Fneutral\u002Fperformance",[70,33,33,133,71,32],[],[137,142,147,152,156,160],{"id":138,"name":139,"points":140,"category":141},"18393364","TabNine",607,"dev_tools",{"id":143,"name":144,"points":145,"category":146},"18398849","Cruip",222,"web_saas",{"id":148,"name":149,"points":150,"category":151},"18359957","Not Depressing",209,"productivity",{"id":153,"name":154,"points":155,"category":146},"18378328","Good Cheap and Fast",183,{"id":157,"name":158,"points":159,"category":141},"18376688","MonoCorpus",180,{"id":161,"name":162,"points":163,"category":164},"18370733","dieulot.fr",166,"security_privacy",false,"v2",{"id":168,"name":5,"line":6,"ai":165,"cat":20,"year":13,"points":14,"comments":15,"rec":29,"s":30,"top":18,"kw":169,"maker":11,"domain":10,"tier":19,"attempts":32,"strip":170,"url":9,"mix":171,"praise":66,"objection":75,"sub":21},18396165,[24,25,26,27,28],"0031303",[32,33,32,34],1793990981732]