Yeah I used Polymer on a production site a year ago. The amount of Google components I had to fork and edit to make them work correctly in all the browsers I had to support was maddening. I think many of the issues I ran into have been addressed but it just soured me on the whole thing (especially since I was never able to get vulcanize to work properly on our mildly complex projext; it had major issues).
Site looks great regardless. That's one of the great things about Polymer.
I might recommend you check out React Standalone if you're interested in Web Components but want to use something familiar (if you're familiar with React that is!). I'm using it right now so I can build an SDK that works both "natively" in a React environment and in vanilla JS + Angular, etc.
That looks pretty interesting. I've done web components manually which were a little awkward but for someone using React this looks compelling. I haven't dived into it much but I'll look into it when I do. Thanks!
Agreed. Also, for being around for more than a year, Polymer is still way behind Android native material components that they claim to emulate. For example, why can't I swipe between the tabs on this website just like an Android ViewPager?
Cool and thanks for sharing. Not as a criticism to you specifically, but a worry I have about technology like Polymer in general: I opened your site and was staring at an empty grey screen for a good 5 seconds.
Maybe your server is busy because of all the HN attention, but I am worried about the future of the web when these kinds of things are becoming normal and acceptable.
Bad frameworks and/or bad usage. Ie, a lot of frameworks don't have good/any serverside support. React does, fwiw.
From my perspective, a good React site is rendered on the server in most scenarios. Meaning the first page you get is pure html and 100% complete. The JS will load and link everything up, but it's nothing that you'll know. If you click a link before the js loads, it should point to a real url and give you full html again. When the js does finally load, json can be used to load new pages, modifying the content with react, etc.
This is also nice because web crawlers (all of them) get simple html, and if a user has JS turned off, they still a lot of your content, perhaps missing some of your UX.
I've implemented a couple content heavy sites like this and it's a nice UX. Performs just as you expect in most scenarios. The only complaint i think that could be valid, is that there is, indeed, a fair amount of JS, which on mobile devices is definitely worse off than if it were just static content.
This is my benchmark for frontend frameworks for the future. Can i compile it, efficiently, on the server before giving it to the user?
Yes, the initial load is heavy. I think lots of it may be device rendering time after the page is loaded- chrome is the only browser that natively renders web components and every other non-blink browser has to wait for polyfills to load. The JS has got to be hard on mobile CPUs especially.
HTTP/2 with server push would help, but I'm hosting on dreamhost shared hosting and they're not HTTP/2 enabled yet. I am using the bundled build option in Polymer which concatenates most of the components, but there's still a lot of assets to serve.
Chrome service worker is working though! Load the site in chrome, then go into airplane mode and hit refresh. (not chrome for iOS though, that's WebKit underneath)
There's also a simple problem in that you're, on that page, not doing much more than showing simple HTML, however in browsers with JS off, for whatever reason, it shows absolutely nothing. Not even a message that JS is required.
Thanks everyone for the congratulations! Thanks also for the 21 and counting RSVPs, some of them are pretty hilarious. I'm looking forward to seeing President Obama, Alec Baldwin, and Mike Hunt at the wedding!
Polymer is greatly undervalued. I takes a bit of time to get into it but once you understand all the quirks, it's smooth sailing.
I really like the simplicity of it.
React is good too, but you need the right framework on top of it (or else it can be a bit tricky to setup properly).
I can recommend Polymer.dart, static typing + webcomponent encapsulation + polymer elements gives really good framework for webapps. It's still not in 1.0 but it's quite stable now.
I think you can bring the time to initial interactive experience way down by using Polymer CLI. Looking at wedding-app.html it looks like it's loading a lot of elements which aren't on screen yet.
If you use the CLI you can create a polymer.json file that lets you fragment up your site: https://github.com/Polymer/app-drawer-template/blob/master/p... This way you'll create separate vulcanized bundles and you can lazy load them right when the user clicks on the section, hopefully improving that first load experience.
Ignore the haters on HN. Congrats on the wedding!!!
Congrats on the wedding, but this site just shows me that I was right not to invest in polymer. On android chrome, 5 second pageload, which seems to be taking place after the download, followed by laggy animation? Yuck.
This, ladies and gentlemen, is why I prefer Mithril, or at least React. Or heck, even the horrific, broken, awful mess that is angular 1 is better than this, for crying out loud!
I know that Polymer may make things easier as a designer, but newsflash: the end user doesn't give a damn. They want a fast, responsive, stylish site. And Polymer just isn't there.
Haha. I wish HN was more frivolous at times, so we could use threads like this one for some good laughs on how your mother-in-law has already got you squared out.
Congrats btw!
I did my wedding website using wix because she wanted to build it (I did the sysadmin parts of it)
Something about the way the borders around the photos shrink while scrolling bugs me. I guess it feels a little akin to how the paintings change in the Disney land/world Haunted Mansions. It's not horrible, but I'm not sure what your intention with the effect was supposed to be.
That said, Congratulations, on the wedding and the website.
I believe many couples still publish wedding announcements in the newspaper with these same details. Announcing on Hacker News doesn't seem any riskier than putting it in the local paper.
Web Components: I think that web components are absolutely the best way to program a web application. Keeping the CSS, HTML, and JavaScript within the boundaries of a component works wonders for organization. It was such a relief coming from the Angular 1 world I usually work in.
Polymer: The polymer elements that Google provides are good. The polymer-cli is fantastic, it just works and I didn't have to configure gulp/grunt/browserify/webpack at all. The project needs no node modules, all dependencies come from bower! Non-google custom elements out there lack robust browser support and I find that I don't trust them out of the box.
Ecosystem: support for web components has come a ways in the past couple years but still has a ways to go. Chrome natively supports web components but every other non-blink browser uses polyfills, which slows things down. Firefox and WebKit are implementing part of the web components spec, so hopefully it'll get better soon.
It's an exciting technology that is very pleasant to code in. Learning the ropes and building the entire site took 20 hours, most of that was dealing with nitpicky browser support issues with scrolling and animation effects. I hope it continues to gains traction and I would definitely use it again!
I'm building something in Polymer. I'm a little worried though. It doesn't appear that cross browser comparability is considered a show-stopper by the Polymer team. Things work great in Chrome but they just don't have the same fit and finish in other browsers. In mobile safari things jiggle, redraw, jump around, and sometimes ignore touch input.
Is it really supposed to have everything on the front page left-aligned in very wide white boxes? Because that's what I get on Safari. http://imgur.com/AnsXVoY
Hmm, that's odd. Didn't test Safari on Desktop, thanks for pointing it out. Maybe a problem with the way I'm using the iron-grid component for grid layout.
I might be. I just do not understand why one should use more complex and less accessible web technologies if it does not lead to new functionality. When I learn a new framework, it usually is so I can do things that I could not do without.
It is a website for his own wedding offering a chance to learn something. I don't understand why there is a need to be pedantic about things like the JavaScript only in this context. It is a reoccurring thing on HN and it doesn't invite us to have a good discussion about the dependency to JS. There is also no need to compare it to yourself. It just comes off very self centered. I understand that in many cases you might not need a certain technology but if there is a fun opportunity to learn a certain thing and using it has little to no harm, why not?
But his point is that the site isn't doing anything that couldn't be achieved without js.
This would be like if a mechanic said he was going to replace your wheels with wooden ones he made himself because he wants to learn how to be a carpenter.