youtube / spfjs

A lightweight JS framework for fast navigation and page updates from YouTube
https://youtube.github.io/spfjs/
MIT License
2.23k stars 147 forks source link

Drupal + SPF #426

Open wimleers opened 7 years ago

wimleers commented 7 years ago

Hiya!

I figured I'd let you know about a potential big user of SPF :) Drupal! https://www.drupal.org/

First: BigPipe

Drupal 8 was released in November 2015. Just before the RC phase, we made some last architectural adjustments that in turn enabled us to start shipping a BigPipe module: https://www.drupal.org/project/big_pipe. As its name suggests, it brings Facebook's BigPipe technique to Drupal (in a nutshell: chunked transfer for HTML).

The unique Drupal twist? BigPipe support by simply installing a module. Zero configuration. Zero code modifications. It just works, for any Drupal 8 site. Thanks to the aforementioned architectural adjustments.

This is a huge deal, because Drupal is "LEGO for the web": there are thousands of modules that can be combined, to build sites for all sorts of needs — both simple and complex. The ability to also have BigPipe work for all those modules, without end users ("site builders" we call them) to know the technical details, or without even having to deal with snippets of code (which is common in WordPress and other CMSes)… that's pretty huge.

In Drupal 8.1 (April 2016), BigPipe was added to Drupal core, as an experimental module of alpha-level stability. In Drupal 8.2, due to be released in a few days, it has moved on to beta-level stability. In 8.3, it should become stable. Chances are we'll enable it by default in 8.4.

BigPipe demo video

Next: RefreshLess/Turbolinks/SPF

We've been thinking about/experimenting with the next step. We started out with Turbolinks: https://www.drupal.org/project/turbolinks. Sadly, Turbolinks 5 was severely limited in comparison to Turbolinks 2 & 3. So, we had to make changes to work around its limitations. The Turbolinks 5 author didn't like this and threatened us so we would rename the Drupal module — even though it was in honor of them paving the path.

So, we ended up renaming it to "RefreshLess": https://www.drupal.org/project/refreshless. On the client, we use all of Drupal's existing JS functionality to support dynamic updates of the page. On the server, we use Drupal 8's cacheability metadata to efficiently determine which parts of the page change, to minimize data on the wire.

Sadly, this means that we have to do all the necessary work to deal with browser quirks.

In July, a Google Summer of Code student that I co-mentored mentioned https://github.com/youtube/spfjs. I'd never heard of it before! I'm currently working on evaluating the viability of using spfjs: https://www.drupal.org/node/2774507#comment-11686089. Of course, the prospect of us using the same JS library as youtube.com is extremely exciting — very little code is as much battle-hardened by real-world testing as YouTube, of course!

(It's interesting to see how turbolinks is limited in some ways and spfjs is restricted in others.)

I've opened #425 and have commented on several issues. I'm hoping this may be a fruitful collaboration with mutual benefit!

wimleers commented 7 years ago

Also opened https://github.com/youtube/spfjs/issues/427.

nicksay commented 7 years ago

Hi! Thanks for opening some PRs! We're absolutely interested in exploring how SPF might work for you, and we're looking forward to any improvements that result. I'll comment on the issues you've started, and we'll go from there!

wimleers commented 7 years ago

Awesome :)