Comparisons between anything that is mostly used by hobbyists will never work as by nature the users are often entrenched in their own positions. When you add a commercial angle to it you can start to separate out the different tools to different jobs. But even then many will be unable to admit that some tools are better for some jobs and just force everything thru the one process/tool.
Blocs Vs RW is a classic. Like Mac Vs Windows, iOS Vs Android etc. Fact is, each will be better for a particular task. Except iOS. Which is just shit at everything but comes wrap in shiny wrapping paper.
I think the performance may be to do with the “parallax” (fixed backgrounds), from my understanding this is heavy going on the graphics chips.
Im running @tav’s scroll mate page here on a brand new 16" MBP and at the bottom of the page the text animation is very jerky maybe 5fps for me. The area that is most effected is the one above the section that also has a fixed BG (on the scroll mate page).
Ultimately I think with animation and styling, it needs to be balanced to ensure a quality experience. @tav’s page uses a lot of white backgrounds, this really helps as less is required to be repainted during scroll. It may get a little more jerky if it was all sections with image backgrounds, it may not.
it all comes down to what you and your clients need.
I was “all-in”" with Rapidweaver for almost 10 years, have a ton of stacks, and over 150 websites built with it. BUT Rapidweaver 8 was a huge let down for me. It just isn’t keeping up with where the rest of the web builders are now. I may have built my business with Rapidweaver, but times have changed, my clients want things like:
blogs they can add to
add new pages to their websites
change the layout on pages (add sections, content areas)
add new “plugins” themself
and basically have control of their own website after I build it for them
Rapidweaver can’t do this, even with the various CMS’s so I bit the bullet and moved on
I now use “Blocs (with Pulse CMS)” for simple brochure sites. I can turn it over to them, and the client can blog, add pages, and they don’t need to buy Rapidweaver (and Stacks, and every stack I used…) to make changes to their own website. And the code Blocs creates is generally far cleaner, and scores far better in PageSpeed tests than anything Rapidweaver can do…
For larger sites - I am all in on OxygenBuilder for Wordpress, a seriously cool “theme builder”, that is $169 for an “agency license” lifetime unlimited sites. (or only $99 lifetime/unlimited, if you don’t need/want the Woocommerce and Gutenberg builders) You can even customize WooCommerce pages with it. And this is not your old Wordpress crap - it creates sites with very clean/fast code, with access to all the goodies you can get with Wordpress.
I still have about 75 active Rapidweaver sites, but over time I will be converting them all to either Blocs or Wordpress, depending on the needs (one goes live today using the new “Volt CMS” for Blocs, a CMS by longtime Rapidweaver developer InStacks). Rapidweaver was great, and I am still more proficient with it than Blocs or Oxygen, but it is now the past for me.
This is what is so strange - it seems to be machine dependent. I have tested on everything from a 2018 MBP back to a 2010 MacBook Air and there is no jerk at all in any browser and also iOS (its an SVG not text I presume you a referring to). I am aware though that I have seen stuttering on pages that other people report as smooth in the past. In this respect it makes no sense.
Background attachment fixed does take a lot of GPU time for the browser for sure and when it is overdone a page can start to be less than ideal.
In general I think that scroll triggered animations look gash and don’t produce a nice user experience except in very specific sites. In my opinion, most users would be better off not using them in the first place.
Just got home and got to measure it. On a 2010 MacBook Air 1.6GHz with 4GB Ram (the lowest power machine I could find), frame rate never drops below 28.7fps even with crazy scrolling up and down. With normal scrolling as the page would be viewed, the frame rate is well above 40 fps. I should also point out that it is a ridiculous demo page with tons of animations.
I’d love to know how you can get it to drop to 5fps?
On a 2011 MBP with 16Gb ram running macOS 10.13, it is pretty jumpy on Safari. I don’t recall seeing that particular demo page before, but the other demos were buttery smooth.
There is always a chance it is dependent on other things running on the machine as I use RAF so it will immediately yield to other processes with higher priority (trying to be a goo neighbour approach)
I’ve seen odd stuff happen with newer GPU’s that older ones handle no problem. When Apple pushed the WKWebview, newer Mac GPU’s were optimised differently for it (Im guessing) as using the traditional old school WebView was choppy as hell on newer Macs. I had to re-write large portions of Blocs to handle the move to WKWebview, older Macs didn’t have any issues with it (WebView).
This is just a guess, I didn’t measure it, it just jumped from the edge to the center with pretty much no transitional frames.
I’ve just looked again and I was actually doing the opposite to you. I was scrolling slowly (like a user would - maybe slower), it appears for me (in chrome) to clog up and pause the animation until the scroll event is complete, so the animation is actually not synced with the scroll at all.
At the top of the page the text SVG behaves correctly and stays in sync with the scroll position.
Any way - we should de-hijack this thread and let it return to where it was.
For the record of anyone reading this, I own Blocs and RW and I don’t even make web sites, I just like to support small developers. I always intended to write some Brics but I had a slight enormous heart attack and decided to step back.
If people are making websites then they should just adopt the tool that works for them and probably have several things in their armoury. I think this was @steveb’s point pretty much.
PS - Forgot to mention, if you are using Safari and you have Develop > Experimental Features > CSS Animations via Web Animations enabled it will kill ScrollMate smoothness.
Chrome has already implemented this (properly) and it is fine but safari is utterly pig dogged.
After a week of pretty intensive work with Blocs I’d say I’ve now got to a good level with it. I’d suggest that while I’m no expert I am across about 80% of what it can do. I don’t know how to do all of this 80%, but I have my head around it enough so that given enough time, I could work out how to do most of the things it’s capable of.
This isn’t down to my own genius but the fact that Blocs is really pretty simple to understand, once it “clicks” with you.
As for RW V Blocs, I don’t think it’s a case of using one over the other, but using either based on it’s suitability to the task at hand. I know what while I initially only bought Blocs to “have a play” and try out a devs new CMS, I will most certainly be using it for some commercial sites going forward, as for some of the work I do it’s simply a better tool than RW.
And that’s the point: You don’t have to come down on one side or the other. No one is stuck in a monogamous relationship with their existing web making tools. You can be a total slut and fool around with as many as you want. And other than a few disapproving comments from some quarters on some forums, no one will care.
Plus of course, as Tav said, the bigger your arsenal of tools is, the better protected you will be from any unexpected changes down the line.
Anyway, the demo site I’ve been building out all week is now done. I think I’ve got everything covered, but if anyone spots any issues let me know.
@steveb I bought Blocs about a year ago: mainly to support the developer who was creating a innovative product. But I haven’t really played around with it yet (no time).
In your mind what are some use-cases where Blocs would be a more favorable design tool for you? I’m not asking out of idle curiosity, but when I start to learn Blocs I’d rather tackle a challenge which it probably addresses better or easier than RW.
Many thanks in advance for your various comments. It’s been great reading!
To understand my answer to that you need to consider the types of sites I build and the types of clients I focus on: I work only with sole traders and small, even micro, businesses, typically employing less than 10 people. I do take on the odd job from what would normally be termed SME’s, but it’s never a good experience for either of us: They generally don’t like the down to earth (no-bullshit, no niceties) way I am (most I find want someone to blow smoke up their arses!) and I don’t have the patience for doing things my committee ("you employed me cus I know what I’m doing, so just let me do things my way).
My sites are not fancy. I avoid where possible clever effects and designs in favour of function over form. This is partly due to my own limitations as a web designer, but also because after doing this for 20 years I know what actually works from the users POV. I always tell my clients: My websites are not there to wow, that’s the job of your product or service, my sites simply present your products or services in an easy to understand and easy to navigate “shop front”.
My websites fall into two categories: Templates and bespoke. Templates are typically pre-designed/built sites that I customise to suit the client “look” then add the clients content.
For my template sites I have a range of “addons” that clients can select to have dropped in to add functionality. Addons are typically built around stacks or scripts I have.
I reckon I can now use Blocs to do some of the template sites, so long as people don’t want the addons. But I’m more interested in using Blocs to offer an even simpler form of template site: Modules. The idea is that there will be a single “wireframe” for a module site, the user just selects the modules (blocs/brics) and I build it all up using simple drag and drop (or click to pickup and add in the Blocs world). I’m even tempted to spin this off as it’s own “service” outside of Caffeine Injection. Maybe.
I should add at this point, before the Blocs fanboys pile in on me, I’m not suggesting Blocs is only for building simple sites. I’m just saying at the moment my plan is for ME to use Blocs for simple sites.
EDIT: I should also mention this, as someone will look at my prices and think I’m too cheap (I am)… I don’t really look to make money from the initial build of templates. I host all my sites, I make the money from this and from monthly update charges.
Steve’s answer is a valuable insight into using Blocs.
One area where I see Blocs being a more appropriate tool of choice is when the requirement is to rapid prototype a site, i.e. get something up and running quickly, and Steve’s excellent demo is a good example of this. Building that site with RW would be challenging for most RW users and demand a good knowledge of many stacks, including a good knowledge of a framework that can build it, yet it’s a quick build for someone who knows how to use Blocs.
For those not familiar with Blocs, it has a facility to save each section (or Bloc) on the page, to be saved for further use, so that over time, you can build up your own catalogue of pre built sections (Blocs). So using Steve’s site as an example, that site could be saved as 9 sections, and then to build it again, would be just 9 drag and drops on a WYSIWYG page.
Also the typical RW user would probably generate a lot of support requests along the way and probably mostly to BWD. So the Blocs solution would have a lower Support Footprint and while this isn’t a concern of anyone except a handful of developers, wouldn’t it be better if they could focus on development instead of support.
I’ve got to head to the vets again later (one of my dogs has had a cruciate operation this week, hence I’ve had the time sitting on my arse this week looking after him to play with Blocs) but once I’m back I’ll throw (literally throw) together another demo site using only the pre-fab’d Blocs content sections (called blocs). I’ll time it and then publish it, so you can see what is possible with zero “design” skills, once you understand how Blocs work.
Off the top of my head I’m thinking a nice four page site with the usual content on each page will take about 30mins to build-out. Obviously styling it and adding content would take the time, but I’d say you’d get the structure done in no time. I’m back about 3ish.
If you start to build bigger sites with Blocs it is a very good habit to start applying precise custom class names to avoid potential confusion, so I will sometimes have classes with a name like H3-Steve-Jobs-Quote-Home-Page.
The point is that if you simply had a custom class called H3-Style any changes to that class are global and instant wherever they are applied. If you just want something slightly different for a particular area, duplicate the class and alter it with a new name to separate it from the rest.
You can do it as much or as little as you like or you can device your own naming hierarchy but it may be worth reading about BEM naming strategies and others to keep class names manageable , expandable and re-usable http://getbem.com/naming/