7 ms·

Do we really need Instant Articles (Facebook) and AMP (Google) when we can accomplish fast loading pages with plain, uncomplicated HTML and CSS? I feel that ma

Do we really need Instant Articles (Facebook) and AMP (Google) when we can accomplish fast loading pages with plain, uncomplicated HTML and CSS? I feel that many web developers don't realise that simple HTML and CSS is often all you need to make clear, fast loading pages. No complicated tricks or techniques required. You can make the page reasonably pleasant in appearance too. Think of the sites you often visit: news stories, blogs, magazine-style sites, discussion sites. These are mostly text, not web apps. I hope I'm not hijacking this thread, but I'd like to ask if readers find the web page links below fast to load on their mobile phones? They don't use AMP. I created the pages below as a test because I was (and still am) frustrated by the slow page-loading speeds when using my phone with a 3G connection. The page links below represent a common article/blog/report style of page. There's about 2500+ words on the page. The page content is CC licensed but the pictures from the original synopsis are not included despite the references in the text (since this was just a test) So is it fast? Version A: http://interfacesketch.com/test/energy-book-synopsis-a.html http://interfacesketch.com/test/energy-book-synopsis-a.html Here is an identical version to the above but one that loads custom fonts (approx 40kb extra). Is this slower? Version B: http://interfacesketch.com/test/energy-book-synopsis-b.html http://interfacesketch.com/test/energy-book-synopsis-b.html

newsat13 10y ago
> Do we really need Instant Articles (Facebook) and AMP (Google) when we can accomplish fast loading pages with plain, uncomplicated HTML and CSS? Can you suggest frameworks that help me do this automatically? Please no, raw html. I daresay that those would recommend developing without frameworks have no experience maintaining other people's projects.
- Zikes 10y ago
  We need it like we needed "use strict" in JS, which is to say not really, but it really helps. I think of AMP as "HTML Strict", a means of enforcing the rules and practices necessary for faster web sites.
  - SahAssar 10y ago
    So having to include another JS file to use a form or input element is best practice now? Source: https://www.ampproject.org/docs/reference/components/amp-form https://www.ampproject.org/docs/reference/components/amp-for...
headcanon 10y ago
We're not talking about developer/technical blogs, which are generally very lightweight, and the person making it likely takes pride in things like efficiency. Your typical content publishing platform on the other hand, is a giant mess of wordpress plugins, tracking, ads, and scripts that pull in other scripts that pull in other scripts. Is it efficient from a technical perspective? No, but it gets the job done for them. AMP is a solution that makes it dead simple for these shops to get a reasonable load time for their content on mobile, which translates to less time spent, which at the end of the day is more important to them.
- CaptSpify 10y ago
  The problem is that their framework is too big and bloated. Your suggestion is to have them add another layer on top of that, rather than remove the bloat?
  - headcanon 10y ago
    Welcome to the real world my friend. Good engineering takes a backseat to clicks and pageviews in the online publishing industry.
mark242 10y ago
Okay but let's be realistic-- you are not a major publisher trying to make money off these pages. You can say "yes my page loads in 100k and 300ms until DOMContentLoaded" all you want, that doesn't change the fact that when you slap a couple of pieces of advertising on there, it's going to slow down. To give you an idea-- the New York Times page without any advertising on it is 2MB and has a DOMContentLoaded event at 1.29s, approximately 1 second slower than your page. With advertising, it is 3.9MB and 1.82s. When ad networks are able to run without almost 2MB of Javascript, then we can talk about how AMP isn't needed.
- djrogers 10y ago
  > you are not a major publisher trying to make money off these pages. Hate to break it to you, but major publishers aren't making any money of the AMP'd version of their pages - most of the monetization is stripped out, and readers aren't even actually on their site so they won't stay and click around.
  - oatmealsnap 10y ago
    They have AMP-approved ads that can be loaded.
  - kyrra 10y ago
    The spec for amp specifically has an "amp-ad" tag for displaying ads. There are multiple ways they can be shown in an AMP page. The nice thing about AMP ads is they will not cause the page to change layout/flow as they load. I believe a size must be declared for ads to prevent bad behavior. https://www.ampproject.org/docs/reference/components/amp-ad https://www.ampproject.org/docs/reference/components/amp-ad
    - djrogers 10y ago
      I didn't say they couldn't show ads, but basic ads aren't the only way that these places monetize. Trackers, 'you might also like' panels, etc all feed in to the overall monetization strategy. A couple of amp-approved ads on an amp-page don't necessarily make up for all that...
err4nt 10y ago
You already know they're dang fast :P Version B was noticeably slower for me on desktop, but still 100% okay in my book. Version A was near-instant. My eye caught that the image didn't magically appear fully loaded, but after a split second loading was complete and the page (and layout) look great!
- interfacesketch 10y ago
  Thanks for trying out these test pages! When I created them, I tried loading them in different locations on my phone. Surprisingly, even in busy city-centre locations (using 3G), the pages weren't always loading instantly - but they were fairly fast, enough to feel usable.
vorpalhex 10y ago
I mean, really, that's most of AMP: a restriction on a bunch of elements that may slow things down and a bit of special mark up so things can be further accelerated. If most websites actually did load quickly, then I don't think AMP would have a reason to exist. But if most websites can't manage to slim down their bloat, then one potential answer may be to take away some of their toys (and I'm not saying it's the right answer, just a large part of AMP).
- infogulch 10y ago
  Ok, so the solution is to create a standard subset of elements and create an open tool to test your site against the standard. If your page meets the requirements it gets the pagerank boost. If it doesn't meet the requirements somewhere then it points out what you need to change. No need for AMP. Why wouldn't this work?
  - wmf 10y ago
    That would work (and personally I would prefer if AMP went in that direction) but it would be merely fast instead of crazy fast because apparently prerendering is only possible if you use the Google CDN.
    - infogulch 10y ago
      Why? Chrome has been prerendering pages on search results for years. The only thing I could think of that would make it slower is that you may need to do a DNS request for a different domain, where google's domain is already resolved. (And google probably has a better CDN.)
- elsewhen 10y ago
  google could have opted to create a standard that matches the amp standard, but not host the pages, and not put a "X" bar at the top, and not create new urls. they could have put the lightning icon on the serps next to all pages that are fully compliant with the standard. the difference in speed between google-hosted amp and what i suggest above would be minimal. the reason google didnt do it this way is because amp is not about speed. speed is just the thing they pitch to you to get you to look past all the negative aspects of the system.
bastawhiz 10y ago
> we can accomplish fast loading pages with plain, uncomplicated HTML and CSS? Sure, but news sites don't. That's the problem. They're loaded with bullshit that makes them mostly unreadable on many devices, screws with your scrolling, and takes insane amounts of bandwidth. The problem is that these news sites are fiscally incentivized to make their experiences bad. The more crap you load, the more money you make. The hook here is that Google gives priority to AMP pages. "Make your page be provably not terrible and we'll rank you higher than your competitors" is a really juicy proposition, and it makes the user (who just wants to read their news) happier. To a news site, you're faced with the decision of having more revenue with a terrible UX or potentially less revenue with more traffic.
PascLeRasc 10y ago
Anecdotally, this article for me took about 5 seconds after loading the text to apply its CSS and fonts, which was kinda jarring when reading. I don't need an exotic font to read basic content. I'd most like a simple lightweight site, but I'd take AMP over this site's clunkiness.
Steeeve 10y ago
Version A was excruciatingly slow. Version B was very quick. I wonder if original dns resolution wasn't to blame... or either load or lack of a recent one on your server. I know I'm a little late to the party in this thread.

newsat13 10y ago

> Do we really need Instant Articles (Facebook) and AMP (Google) when we can accomplish fast loading pages with plain, uncomplicated HTML and CSS? Can you suggest frameworks that help me do this automatically? Please no, raw html. I daresay that those would recommend developing without frameworks have no experience maintaining other people's projects.

Zikes 10y ago
We need it like we needed "use strict" in JS, which is to say not really, but it really helps. I think of AMP as "HTML Strict", a means of enforcing the rules and practices necessary for faster web sites.
- SahAssar 10y ago
  So having to include another JS file to use a form or input element is best practice now? Source: https://www.ampproject.org/docs/reference/components/amp-form https://www.ampproject.org/docs/reference/components/amp-for...

headcanon 10y ago

We're not talking about developer/technical blogs, which are generally very lightweight, and the person making it likely takes pride in things like efficiency. Your typical content publishing platform on the other hand, is a giant mess of wordpress plugins, tracking, ads, and scripts that pull in other scripts that pull in other scripts. Is it efficient from a technical perspective? No, but it gets the job done for them. AMP is a solution that makes it dead simple for these shops to get a reasonable load time for their content on mobile, which translates to less time spent, which at the end of the day is more important to them.

CaptSpify 10y ago
The problem is that their framework is too big and bloated. Your suggestion is to have them add another layer on top of that, rather than remove the bloat?
- headcanon 10y ago
  Welcome to the real world my friend. Good engineering takes a backseat to clicks and pageviews in the online publishing industry.

mark242 10y ago

Okay but let's be realistic-- you are not a major publisher trying to make money off these pages. You can say "yes my page loads in 100k and 300ms until DOMContentLoaded" all you want, that doesn't change the fact that when you slap a couple of pieces of advertising on there, it's going to slow down. To give you an idea-- the New York Times page without any advertising on it is 2MB and has a DOMContentLoaded event at 1.29s, approximately 1 second slower than your page. With advertising, it is 3.9MB and 1.82s. When ad networks are able to run without almost 2MB of Javascript, then we can talk about how AMP isn't needed.

djrogers 10y ago
> you are not a major publisher trying to make money off these pages. Hate to break it to you, but major publishers aren't making any money of the AMP'd version of their pages - most of the monetization is stripped out, and readers aren't even actually on their site so they won't stay and click around.
- oatmealsnap 10y ago
  They have AMP-approved ads that can be loaded.
- kyrra 10y ago
  The spec for amp specifically has an "amp-ad" tag for displaying ads. There are multiple ways they can be shown in an AMP page. The nice thing about AMP ads is they will not cause the page to change layout/flow as they load. I believe a size must be declared for ads to prevent bad behavior. https://www.ampproject.org/docs/reference/components/amp-ad https://www.ampproject.org/docs/reference/components/amp-ad
  - djrogers 10y ago
    I didn't say they couldn't show ads, but basic ads aren't the only way that these places monetize. Trackers, 'you might also like' panels, etc all feed in to the overall monetization strategy. A couple of amp-approved ads on an amp-page don't necessarily make up for all that...

err4nt 10y ago

You already know they're dang fast :P Version B was noticeably slower for me on desktop, but still 100% okay in my book. Version A was near-instant. My eye caught that the image didn't magically appear fully loaded, but after a split second loading was complete and the page (and layout) look great!

interfacesketch 10y ago
Thanks for trying out these test pages! When I created them, I tried loading them in different locations on my phone. Surprisingly, even in busy city-centre locations (using 3G), the pages weren't always loading instantly - but they were fairly fast, enough to feel usable.

vorpalhex 10y ago

I mean, really, that's most of AMP: a restriction on a bunch of elements that may slow things down and a bit of special mark up so things can be further accelerated. If most websites actually did load quickly, then I don't think AMP would have a reason to exist. But if most websites can't manage to slim down their bloat, then one potential answer may be to take away some of their toys (and I'm not saying it's the right answer, just a large part of AMP).

infogulch 10y ago
Ok, so the solution is to create a standard subset of elements and create an open tool to test your site against the standard. If your page meets the requirements it gets the pagerank boost. If it doesn't meet the requirements somewhere then it points out what you need to change. No need for AMP. Why wouldn't this work?
- wmf 10y ago
  That would work (and personally I would prefer if AMP went in that direction) but it would be merely fast instead of crazy fast because apparently prerendering is only possible if you use the Google CDN.
  - infogulch 10y ago
    Why? Chrome has been prerendering pages on search results for years. The only thing I could think of that would make it slower is that you may need to do a DNS request for a different domain, where google's domain is already resolved. (And google probably has a better CDN.)
elsewhen 10y ago
google could have opted to create a standard that matches the amp standard, but not host the pages, and not put a "X" bar at the top, and not create new urls. they could have put the lightning icon on the serps next to all pages that are fully compliant with the standard. the difference in speed between google-hosted amp and what i suggest above would be minimal. the reason google didnt do it this way is because amp is not about speed. speed is just the thing they pitch to you to get you to look past all the negative aspects of the system.

bastawhiz 10y ago

> we can accomplish fast loading pages with plain, uncomplicated HTML and CSS? Sure, but news sites don't. That's the problem. They're loaded with bullshit that makes them mostly unreadable on many devices, screws with your scrolling, and takes insane amounts of bandwidth. The problem is that these news sites are fiscally incentivized to make their experiences bad. The more crap you load, the more money you make. The hook here is that Google gives priority to AMP pages. "Make your page be provably not terrible and we'll rank you higher than your competitors" is a really juicy proposition, and it makes the user (who just wants to read their news) happier. To a news site, you're faced with the decision of having more revenue with a terrible UX or potentially less revenue with more traffic.

PascLeRasc 10y ago

Anecdotally, this article for me took about 5 seconds after loading the text to apply its CSS and fonts, which was kinda jarring when reading. I don't need an exotic font to read basic content. I'd most like a simple lightweight site, but I'd take AMP over this site's clunkiness.

Steeeve 10y ago

Version A was excruciatingly slow. Version B was very quick. I wonder if original dns resolution wasn't to blame... or either load or lack of a recent one on your server. I know I'm a little late to the party in this thread.