[{"data":1,"prerenderedAt":335},["ShallowReactive",2],{"project-3009307":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":36,"aspects":37,"strip":45,"post_text":47,"what":48,"said":72,"maker_in_thread":184,"shape":189,"grid":193,"attempts":296,"same_week":297,"maker_shows":32,"maker_hidden":327,"reader_version":328,"card":329},"3009307","Pulse","A simple pulsating indicator.","title","Show HN: Pulse — A simple pulsating indicator.","http:\u002F\u002Fmoeedm.com\u002Fsandbox\u002Fpulse\u002F","moeedm.com","moeedm",1316313051,2011,163,40,47,1097,5,"notable","dev_tools","ui snippet","library",[24,25,26,27,28],"pulsating dot","css animation","map marker","webkit animation","html indicator","roasted",-0.465,{"positive":32,"neutral":33,"mixed":34,"critical":35},2,7,0,15,24,{"execution":38,"performance":40,"docs":41,"design":43,"idea":44},{"positive":34,"critical":39},8,{"positive":34,"critical":32},{"positive":34,"critical":42},1,{"positive":42,"critical":32},{"positive":42,"critical":32},[42,34,34,34,34,34,34,34,42,42,42,34,42,42,46,34,46,34,34,46,46,42,18,42,42,34,34,18,34,46,34,34,42,46,42,42,42,42,46,42],3,"Feel free to use it in your application. You can make it imageless but I used an image just because you can easily swap it out and its a little less code.",{"problem":49,"audience":50,"pricing":49,"motivation":49,"time_to_build":49,"stack":56,"openness":69,"stage":70,"team_size":71},null,{"value":51,"source":52,"evidence":53},"Web developers who want a pulsing indicator on a page.","inferred",[54],{"id":55},"post",[57,65],{"value":58,"source":59,"evidence":60},"CSS","commenter",[61],{"id":62,"by":63,"text":64},"3009330","eykanal","Stick it on Github as three files - image, html, css - so folks can \"watch\" it. I've found that the watch feature of github helps me remember all these little nifty snippets of…",{"value":66,"source":59,"evidence":67},"HTML",[68],{"id":62,"by":63,"text":64},"open_source","launched","unknown",{"praise":73,"objections":85,"requests":119,"questions":149,"alternatives":154},[74],{"value":75,"source":59,"evidence":76},"Nice little effect with useful ideas for force-directed graphs.",[77,81],{"id":78,"by":79,"text":80},"3009336","oscilloscope","Nice little effect. Could work well on realtime force-directed graphs: http:\u002F\u002Fmbostock.github.com\u002Fd3\u002Fex\u002Fforce.html",{"id":82,"by":83,"text":84},"3009633","pharrington","Using JavaScript to render to a canvas will work in all modern browsers, while maintaining (or even enhancing) the CSS's flexibility. I first thought the JavaScript solution…",[86,101,112],{"value":87,"source":59,"evidence":88},"Works only in WebKit browsers, not cross-browser.",[89,93,97],{"id":90,"by":91,"text":92},"3009374","mannicken","It only works on webkit browsers.",{"id":94,"by":95,"text":96},"3009732","retube","Top of hacker news: a dot that.... pulses. And doesn't even work in most browsers. I mean I know it's the weekend and maybe a slow news day, but really?",{"id":98,"by":99,"text":100},"3010150","ajarmoniuk","doesn't pulse on chrome 14.0.835.165m on windows",{"value":102,"source":59,"evidence":103},"Animation uses CSS where an animated GIF or canvas would be more portable.",[104,108,111],{"id":105,"by":106,"text":107},"3009453","abcd_f","I understand it is a very neat piece of CSS scripting, but how does this compare to a simple animated GIF from practical perspective?",{"id":109,"by":83,"text":110},"3009546","GIF's don't support alpha transparency, making them the opposite of practical for an effect like this.",{"id":82,"by":83,"text":84},{"value":113,"source":59,"evidence":114},"Causes high CPU use in Windows Desktop Window Manager under Chrome.",[115],{"id":116,"by":117,"text":118},"3009577","steve8918","Pretty nice, but it appears that whatever method is used to generate the pulse, it causes the CPU utilization of the Desktop Windows Manager (dwm.exe) to shoot up to about 10-15%…",[120,135,142],{"value":121,"source":59,"evidence":122},"Make it cross-browser, including IE9 and Firefox.",[123,127,131],{"id":124,"by":125,"text":126},"3009395","aj","I can't but I'd downvote this simply for not being cross browser compatible in some form",{"id":128,"by":129,"text":130},"3009830","bwblabs","I must agree with most people complaining here, it should work on ALL modern browsers (including IE9). The implementation is not even great either, see this screenr I made:…",{"id":132,"by":133,"text":134},"3009593","zhwang","Firefox 5+ supports CSS3 animations and transforms with the -moz prefix. A quick replace all in pulse.css gets the animation working fine.",{"value":136,"source":59,"evidence":137},"Support multiple targets using classes instead of IDs.",[138],{"id":139,"by":140,"text":141},"3009974","Haraldson","Are you using an image element to support printing? There's no other reasons to not use CSS3 to create the dot (or the somewhat more pragmatic approach of setting it as a…",{"value":143,"source":59,"evidence":144},"Make the pulsing ring easier to see.",[145],{"id":146,"by":147,"text":148},"3009629","kiranryali","I would make the pulsing ring easier to see",[150],{"value":151,"source":59,"evidence":152},"How does this compare to a simple animated GIF?",[153],{"id":105,"by":106,"text":107},[155,159,166,173],{"value":156,"source":59,"evidence":157},"Canvas-based JavaScript pulse implementation.",[158],{"id":82,"by":83,"text":84},{"value":160,"source":59,"evidence":161},"Raphael SVG pulsing dot.",[162],{"id":163,"by":164,"text":165},"3009392","driverdan","Last year I (along with the rest of our Node Knockout team) built a game that had a pulsing dot similar to this one. We used Raphael (SVG\u002FVML). Although it's much heavier than…",{"value":167,"source":59,"evidence":168},"jQuery Pulsate plugin using outline-offset.",[169],{"id":170,"by":171,"text":172},"3010042","kilian","I recently did something similar for more general elements as a jquery plugin: http:\u002F\u002Fjquerypulsate.kilianvalkhof.com\u002F it uses the outline-offset css property, which doesn't seem…",{"value":174,"source":59,"evidence":175},"Foursquare and iPhone Maps style markers.",[176,180],{"id":177,"by":178,"text":179},"3009663","skadamat","haha this looks like the one on Foursquare, neat work regardless though :)",{"id":181,"by":182,"text":183},"3009465","schwa","A little bit (i.e. completely) derivative of the Maps app on the iPhone.",{"comments":42,"answered":34,"key":185},[186],{"id":187,"text":188},"3009345","On it.",{"commenters":190,"max_depth":18,"maker_replies":42,"first_comment_mins":191,"lifespan_hours":192},35,16,14,[194,196,198,200,204,206,209,212,215,218,220,221,225,229,232,234,237,238,242,245,247,250,254,258,260,262,263,267,270,271,274,277,279,280,284,286,290,292,294,295],[94,34,42,195,95,34],"project\u002Fcritical\u002Fexecution",[62,42,34,197,63,34],"other\u002Fneutral\u002Fidea",[187,42,34,199,11,42],"maker\u002Fneutral\u002Fnone",[201,42,34,202,203,34],"3009883","other\u002Fneutral\u002Fnone","flexd",[205,42,34,202,63,34],"3010019",[207,42,34,202,208,34],"3010259","dpritchett",[210,42,34,202,211,34],"3010615","Pewpewarrows",[213,42,34,202,214,34],"3010147","albertzeyer",[216,32,42,195,217,34],"3009368","dfc",[90,32,42,219,91,34],"project\u002Fcritical\u002Fperformance",[124,32,42,195,125,34],[222,32,34,223,224,34],"3009416","commenter\u002Fneutral\u002Fexecution","ubi",[226,32,42,227,228,34],"3009473","project\u002Fcritical\u002Fdocs","techdmn",[230,32,42,195,231,34],"3009940","0x12",[132,32,46,233,133,34],"project\u002Fneutral\u002Fexecution",[235,32,34,236,91,34],"3009610","commenter\u002Fcritical\u002Fidea",[82,32,46,233,83,34],[239,32,34,240,241,34],"3009798","commenter\u002Fneutral\u002Fnone","epicureanideal",[243,32,34,240,244,34],"3009983","udp",[139,46,46,246,140,34],"project\u002Fneutral\u002Fdesign",[105,248,46,249,106,34],4,"project\u002Fneutral\u002Fidea",[251,248,42,252,253,34],"3009462","project\u002Fcritical\u002Fidea","cosgroveb",[255,248,18,256,257,34],"3009515","project\u002Fpositive\u002Fdesign","rocktronica",[109,248,42,259,83,34],"project\u002Fcritical\u002Fdesign",[261,248,42,195,231,34],"3009938",[170,18,34,197,171,34],[264,18,34,265,266,34],"3010050","other\u002Fpositive\u002Fnone","Bootvis",[78,268,18,269,79,34],6,"project\u002Fpositive\u002Fidea",[163,33,34,202,164,34],[272,33,46,199,273,34],"3009464","Empact",[275,33,34,202,276,34],"3009680","SkyMarshal",[278,33,34,202,164,34],"3010408",[116,39,42,219,117,34],[281,282,46,249,283,34],"3009769",9,"gmantastic",[128,285,42,195,129,34],10,[287,288,42,195,289,34],"3009654",11,"pongo000",[98,291,42,195,99,34],12,[146,293,42,259,147,34],13,[177,192,46,249,178,34],[181,35,42,252,182,34],[],[298,303,308,313,318,322],{"id":299,"name":300,"points":301,"category":302},"3002117","Hacker News Mobile",209,"consumer_social",{"id":304,"name":305,"points":306,"category":307},"3003794","Fluid iPad App Concept",179,"productivity",{"id":309,"name":310,"points":311,"category":312},"3022245","martin.drashkov.com",160,"hardware",{"id":314,"name":315,"points":316,"category":317},"3010970","Kerning.js",154,"languages",{"id":319,"name":320,"points":321,"category":307},"3008450","ClassMetric",133,{"id":323,"name":324,"points":325,"category":326},"3013292","Crowd²",106,"web_saas",false,"v2",{"id":330,"name":5,"line":6,"ai":327,"cat":20,"year":13,"points":14,"comments":15,"rec":29,"s":331,"top":18,"kw":332,"maker":11,"domain":10,"tier":19,"attempts":34,"strip":333,"url":9,"mix":334,"praise":75,"objection":87,"sub":21},3009307,-0.46,[24,25,26,27,28],"1000000011101130300331511005030013111131",[32,33,34,35],1794036490307]