5 ms·

Cool. I'm actually building something very similar @ http://evanplaice.com http://evanplaice.com. I use Markdown/JSON for all of the content. Markdown files can

Cool. I'm actually building something very similar @ http://evanplaice.com http://evanplaice.com. I use Markdown/JSON for all of the content. Markdown files can easily be embedded in a page using the <ng2-markdown> directive I wrote. The source is @ http://github.com/evanplaice/evanplaice.com http://github.com/evanplaice/evanplaice.com. I'm planning to eventually extract the good bits, and adapt it to work with Jekyll files. Front-matter support is the last major road block. Google shouldn't have any issue indexing AJAX-loaded content. On my site it's the Angular2 router that's really screwing SEO. You can test it out using the 'Fetch as Google' tool.

afandian 11y ago
You should know that your page was blank for about 20 seconds. I nearly closed it.
- kecks 11y ago
  Took 6 seconds on a Samsung Galaxy S6, Firefox. I definitely would've closed the tab if I hadn't read this.
  - EvanPlaice 11y ago
    The combined size of the concatenated js/css files was 1.7mb before compression. Now, both combined are 366KB respectively. The load time should be much better now.
- plexicle 11y ago
  Oh, it actually worked? I waited a couple seconds and closed it, assuming it was broken.
- EvanPlaice 11y ago
  Yes, I know. Emphasis on 'working on.' I haven't gotten to optimization yet.
- EvanPlaice 11y ago
  Try it again.
  - afandian 11y ago
    5 seconds browser loading. Then blank screen for about 5 seconds. Then a spinner for about 3 seconds. No matter how much optimisation you're doing, you're still destroying the progressive loading of HTML pages and the ability for my browser to tell me how my page is loading. It may be a fun project, but it's not based on sound technical decisions, in my humble opinion.
opiotrek 11y ago
That is truly terrible user experience. Pure example of form over substance.
- deleted 11y ago
  [deleted]
jackmoore 11y ago
I see you are getting some negative feedback, haha. I think the main problem at this point isn't due client-rendering, but the large prerequisite files. Gzipping your JavaScript would trim a MB or more. Putting the static assets on a CDN (or enabling gzip yourself) would cut the render time by 2/3rds. Semantic UI adds 700KBs of CSS, which seems like a lot more than your site should need. Even if this were a static rendered site, the browser would delay rendering anything until the CSS was downloaded.
- EvanPlaice 11y ago
  Haha. I figured 'working on' would signal that this isn't 'production ready' yet. Guess I should choke down my excitement and stay in stealth mode until I'm ready next time. The entire app is server-less and hosted on a S3 bucket. Gzipping the content should be an easy addition to the build process. I'm using approximately 2% of what Semantic-UI is capable of. Fortunately, Semantic-UI provides a set of tools to trim it down to a production-ready bundle. In addition, Google will likely trim more of the fat from Angular2 in upcoming releases. The big one I'm concerned about is Rxjs. The size of the lib is massive considering it only provides support for observables and observable extensions. Trust me, I'm painfully aware of how slow it is right now. Thanks for the feedback though. I do appreciate it.
- EvanPlaice 11y ago
  Feel free to try it again. The css and js are now merged and concatenated into one and gzipped. Total size of both is now 366KB The time to bootstrap the app is about 1.5 seconds. There's room for improvement but I don't expect any massive gains since I can't isomorphically pre-render without a server back-end.

afandian 11y ago

You should know that your page was blank for about 20 seconds. I nearly closed it.

kecks 11y ago
Took 6 seconds on a Samsung Galaxy S6, Firefox. I definitely would've closed the tab if I hadn't read this.
- EvanPlaice 11y ago
  The combined size of the concatenated js/css files was 1.7mb before compression. Now, both combined are 366KB respectively. The load time should be much better now.
plexicle 11y ago
Oh, it actually worked? I waited a couple seconds and closed it, assuming it was broken.
EvanPlaice 11y ago
Yes, I know. Emphasis on 'working on.' I haven't gotten to optimization yet.
EvanPlaice 11y ago
Try it again.
- afandian 11y ago
  5 seconds browser loading. Then blank screen for about 5 seconds. Then a spinner for about 3 seconds. No matter how much optimisation you're doing, you're still destroying the progressive loading of HTML pages and the ability for my browser to tell me how my page is loading. It may be a fun project, but it's not based on sound technical decisions, in my humble opinion.

opiotrek 11y ago

That is truly terrible user experience. Pure example of form over substance.

deleted 11y ago
[deleted]

jackmoore 11y ago

I see you are getting some negative feedback, haha. I think the main problem at this point isn't due client-rendering, but the large prerequisite files. Gzipping your JavaScript would trim a MB or more. Putting the static assets on a CDN (or enabling gzip yourself) would cut the render time by 2/3rds. Semantic UI adds 700KBs of CSS, which seems like a lot more than your site should need. Even if this were a static rendered site, the browser would delay rendering anything until the CSS was downloaded.

EvanPlaice 11y ago
Haha. I figured 'working on' would signal that this isn't 'production ready' yet. Guess I should choke down my excitement and stay in stealth mode until I'm ready next time. The entire app is server-less and hosted on a S3 bucket. Gzipping the content should be an easy addition to the build process. I'm using approximately 2% of what Semantic-UI is capable of. Fortunately, Semantic-UI provides a set of tools to trim it down to a production-ready bundle. In addition, Google will likely trim more of the fat from Angular2 in upcoming releases. The big one I'm concerned about is Rxjs. The size of the lib is massive considering it only provides support for observables and observable extensions. Trust me, I'm painfully aware of how slow it is right now. Thanks for the feedback though. I do appreciate it.
EvanPlaice 11y ago
Feel free to try it again. The css and js are now merged and concatenated into one and gzipped. Total size of both is now 366KB The time to bootstrap the app is about 1.5 seconds. There's room for improvement but I don't expect any massive gains since I can't isomorphically pre-render without a server back-end.