6.0: What's To Come


#1

As you may have heard, we’re busy working on the next major version of Surreal CMS. I’m not open to sharing all the ideas we have right now — but there are some really, really good ones lined up.

Here are a couple high-level things we’re experimenting with.

Content Boundaries & Blocks

Surreal coined the class="editable" paradigm nearly a decade ago. It’s become one of the easiest ways to add a CMS to an existing website.

But now it’s time to take things further. We want to help you build your next website.

In 6.0, Code Snippets will become a first class citizen and will be renamed to Blocks. To make them more powerful, we’re introducing a new feature called Content Boundaries that lets you define an element to act as a container for your blocks. You’ll be able to add/remove/reorder blocks anywhere inside a content boundary.

In addition, blocks will no longer be editable by default. You’ll be able to define editable regions inside your blocks, giving you complete control over their structure.

What’s really interesting about this is that a block can be just about anything. You can create a photo gallery block. Or a two-column block. Or a contact form block. It’s just HTML/CSS/JS.

With the right blocks, you’ll be able to build an entire website from scratch!

Static Includes

This feature introduces a way to share content regions across multiple pages (e.g. header, footer, sidebar, etc.) without having to use PHP, ColdFusion, or Server Side Includes. This is especially useful for websites hosted on Amazon S3.

The proposed syntax is:

<div class="cms-include" id="your-id">
  <p>Your content here</p>
</div>

When published, Surreal will update all pages that have a cms-include element with a matching ID. Of course, that will mean publishing takes a bit longer since we have to write to multiple files via FTP/SFTP — which brings us to…

Transfer Agent

Because FTP and SFTP tend to be very slow, I’ve prototyped a transfer agent that Surreal can install
on most servers automatically via FTP/SFTP. Using the transfer agent’s secure API, we can significantly speed up transfer operations such as directory listings, publishing, uploading, and downloading.

In my prototype, I compared uploading 50 files to the same server:

  • FTP - 62.8 seconds*
  • Transfer Agent - 2.7 seconds

*This was the speed for a single FTP connection. This can be improved on some FTP servers by using multiple connections, but we’ve found many shared hosts limit (or simply don’t allow) multiple simultaneous FTP connections.

As you can see, using a transfer agent really speeds things up and will make new features such as Static Includes possible in FTP/SFTP environments.

Blogging

Last but not least, with a handy dandy transfer agent to speed things up, we’ll finally be able to introduce a proper blogging tool! Imagine a full-featured blog with customizable templates that you can add to your website with a single checkbox.

Of course, we’re still hashing out some of the details for blogging in a static environment, but we’re getting close — and almost ready to start coding it!

  • Posts
  • Tags
  • Simple template language for customizing
  • OpenGraph, Twitter Cards, JSON-LD metadata (makes your posts more shareable)
  • RSS feeds
  • JSON feeds
  • JSON index (for client-side searching)
  • Import from WP

Dev Update

Developers will be interested to know that we’ll be moving to Node.js for 6.0. Surreal has traditionally been a PHP application, but our hearts are with JavaScript so we’re making the switch this time around. That means we’re rebuilding everything from the ground up! :muscle:

6.0 will also feature many UI improvements, lots of little improvements, and a number of under the hood optimizations that will make Surreal faster and even more reliable.


Alright, so what do you think of what we have in store for 6.0? What else would you like to see while we’re in the design/early dev stage?


#2

What are your plans to support websites that exist prior to the new update?


#3

Can’t wait, this update sounds ace


#4

You’ll still be able to integrate existing websites as you always have. These are mostly new features that will be added on top of the existing API :slight_smile:


#5

Thank you, it sounds very good.
My questions: Will we have the chance to see it before users? Will we be able to decide when to upgrade users? Any approximate date to the upgrade?
Looking forward to it :slight_smile:


#6

Perfect. Thank you. Now for the other 20 characters. :wink:


#7

You’ll be invited to the beta, absolutely! The current version will remain online as long as users need it — we’re not pushing anyone onto 6.0 until they’re ready.

As for dates, I don’t provide them because software is unpredictable and getting it right is more important than meeting a deadline. Possibly 3-4 months is a good guess. Follow the forum and Twitter for updates in the meantime :slight_smile:

We also have another pretty big announcement [hopefully] this week. Just waiting for something to finalize before I can talk about it.


#9

Sounds amazing, especially the Blog functionality. Will save our customers having to log in to two systems. Excited!


#10

Hi Cory,

I’m looking forward to see this online, soon!

  • From my point of view, and to improve PageSpeed, it would so useful if you add features for PICTURE and/or IMG tags with SRCSET attribute!
    As you already know, PICTURE with SOURCE allows you to load multiple versions of the same image (maybe on a phone display you need a square image, on tablet… you may need a rectangular version of the same image etc.), therefore, I would suggest let the user uploads these files and specify SIZE attribute… in a text box area, after the upload button…

  • Support for SCHEMA.ORG attributes on HTML tags. Right now, if you add class=“editable” on a parent div that contains a child div with itemprop=“something” or other schema.org specific attribute, when parsed through CMS, all the itemprop(s) are erased by default… For example, in order to work right now, you have to write the code something like:

<figcaption class="autor" itemprop="author" itemscope itemtype="https://schema.org/Person">
<p>
<span itemprop="givenName"><span class="editable" id="prenexpert1">Cristian</span></span>
<span itemprop="familyName"><span class="editable" id="numeexpert1">T.</span></span>, 
<span itemprop="address"><span class="editable" id="locatiecursantexpert1">Bucuresti</span></span>
</p>
<p class="editable" id="numecurstestimexpert1">Curs Expert Achizitii Publice</p>
</figcaption>

In this example, you can see that you must consider editable class after the tags that contains itemprop. It could be so much easier if we could consider editable class in the parent tag, meaning FIGCAPTION.

Also, because all the itemprop(s) are erased, you cannot enjoy the wonderful feature of REPEATABLE ITEMS, because all the itemprop(s) that may be found in the repeatable area, are now deleted…

  • I am also very interested in the BLOG area… It would be nice if you can manage a way to automate the snippet from the main article, meaning the title, picture, introducing paragraph and Read more link… in the page that summarize all the articles… This I consider to be a wow support. Right now I make the code for the snippet and consider it a repeatable item… but the user has to write two times the title, paragraph and select the image twice… also, it has to select the correct link to Read more anchor… Also, still at this chapter, it could be wonderful if you add some auto loading support for all the articles’ snippets.

  • I am interested in these STATIC INCLUDES that you proposed. In my point of view, if you make these STATIC INCLUDES via JS, you can slow down the PageSpeed. In my point of view, the best way to include is via SSI as the including is made at server side, not on the clients’ browser. Also, as you know, PHP is considered a little bit slower than SSI, not to mention JS inclusion.

Hope you may find these suggestions to be at least interesting and debatable…

Best regards,
Catalin


#11

Support for <img srcset> would be nice. We’d have to find a way to do it automatically somehow, as 99% of users aren’t likely to resize images and/or populate this correctly. Maybe something in your sites settings that provides a config for how Surreal should do this. :thinking:

Similarly, support for Schema.org attributes is something most users simply won’t do (or won’t do properly). Also, preserving them in the editor presents the problem of users not being able to “see” them in a WYSIWYG environment. They could easily override them or delete them.

However, with the blocks concept I mentioned it will be possible to do something like this in a block:

<span itemprop="givenName" class="editable">Bob</span>

And then repeat/reorder that specific item. Of course, this is kind of possible now but without the flexibility of adding/remove/reordering them.

For blogs:

It would be nice if you can manage a way to automate the snippet from the main article

Absolutely, excerpts will be customizable in your template and based off each posts’s content. Similar to how Postleaf works:

{@excerpt paragraphs="2" tags="a,em,strong"/}

For static includes:

In my point of view, if you make these STATIC INCLUDES via JS, you can slow down the PageSpeed.

Not only that, but search engines won’t index that content :tired_face:

Static includes will be a game changer, for sure. We have a lot of users who host with Amazon S3 and this is something that will allow you to do so much more with static websites :slight_smile:


Synchronized Text Boxes?
#12

I would love to see git integration so that changes my clients make can be pushed back to the repo when I go to edit their site again.