toinbis

As for other points, let me elaborate on web analytics. Google Analytics default seup collect around 70-80% of transactions/events/pageviews data. If you want to fix this, you revert to server-side stuff, and that's where you meet js-based navigations.

That's when you either try to go this way with gatsby: https://www.gatsbyjs.com/plugins/gatsby-plugin-no-javascript... .

That's when you are stuck with sapper: https://stackoverflow.com/questions/64507516/how-to-disable-... .

That's when you end up in tickets like this with Nextjs: https://github.com/vercel/next.js/issues/4381 . And never look back.

Client-side a/b testing/personalizations(default option for google optimize, visual website optimizer, optimizely) mean you have to use page hiding snippet - https://support.google.com/optimize/answer/7100284?hl=en.

Which, if you look at it closer - "'dataLayer',4000," 4000 ms mean that you basicly make your website white blank for up to 4s while all the ab testing loading stuff is happening behind the scenes.

And this makes your initial load UX a very very awkward experience.

If personalization / ab testing is happining on load-time parameters (i.e. country), well, you are in a situation where I have mentioned hydrated site is out of options to be considered for the stack selection.

You should NOT use nuxt, react, gatsby in bussiness environment for anything but internal employee-facing applications.

Reasons being, that nextjs&friends(hydrated site alongside js-based navigation) make it:

a)impossible to do decent a/b testing;

b)impossible to do decent personalizations;

c)impossible to have decent page load times;

d)impossible to have any decent web analytics;

e) team is unable to understand what's going on with a page after looking into source code - devs get more control in expense of ppc teams, ux teams, cro teams, analytics teams, data teams, sysadmins, monitoring teams. This is the biggest killer argument even though a)-d) arguments might seem fancier at first. Sooo many devs just can't ever relate to this, because yes - reactgasm is a strong emotion. But you have to think about others. Devs can survive jquery. Marketer can not survive react.

So You just stick to css+html+vanilla js+web components(svelte or stencils or whatever). That is based on my 8+ years working as a marketer/product owner building billion-grade ecommerce projects.

As you have not spent too much time on elaborating your points but throwing out strong opinion to the wild, I will do more or less the same.

Happy to discuss in comments though :)

Sure! :) But I think it's all just about few principles. Elaborated a bit more on them:

1. Tailwind CSS classes extracted with purge-css, all inlined.

2. Favicon inlined, small images (<4kb) inlined. Not sure what’s the best threshold. Here is all https://turboeshop.com/inlinedimages/ is all page in one requests. Meaning two big images that are https://turboeshop.com/fastestpageintheworld/ were inlined - results are way worse. So larger images - definitely excluded.

3. Gzip stuff(as one commenter below commented, not done in turboeshop.com/fastestpageintheworld/).

4. Everything from same domain and subdomain. If you want cloudinary or friends, I guess they are only allow subdomain. This is totally OKeish exemption. Or maybe there is a way to work around that cloudinary serves, Cloudflare caches.

5. JS - inlined. Cash.js maybe if you need jquery replacement, or just vanilla. Little content on vanilla js nowadays :), https://gomakethings.com/articles/ is something interesting. Don’t want to flame here, am not js expert, maybe someone can elaborate.

6. For compex components - svelte web components (or stencils or lithtml) - I’d prefer svelte but am not sure what’s best.

7. Google analytics a) - there is new google analytics (GA4) with measurement protocol2 and new server side google tag manager. Serve side gtm does two things a) serves gtag.js; b) accepts measurement protocol hits and sends to GA. Take a look how it’s done - https://www.simoahava.com/gtm-tips/build-custom-universal-an... , it’s very similar as cloudflare workers, cool stuff. But it’s hosted on Google App Engine, thus - slow. But you don't need google's server anymore, you control full infra, so why not setup simple cache here.

8. Google analytics b) To owerome latency to Google App engine, so you make async proxy in cloudflare workers - one worker to proxy for gtag.js download, one for serving gtag.js from your own domain. <script src=“http://yourdomain.com/workers/gtag/js?id=G-1234455> . Basicly just serve from js cache and check every once in a while if google hadn’t changed their code. Same for GA hits. It used to be google-analytics.com/collect endpoint, server side gtm allows to host collection yourself. You again make worker-proxy, define it in gtag’s transport_url:'https://turboeshop.com/measure' setting and make sure worker returns non-blockingly, and just then forward the measurement protocol hit from worker async-ly with event.waitUntil().

9. Google analytics c) The gtag.js/analytics.js is a huge file and you have no control, so maybe just use https://github.com/segmentio/analytics.js instead or check out https://www.thyngster.com/app-web-google-analytics-measureme... (search “navigator.sendBeacon”) - craft measurement protocol yourself and send it to gtm. I plan on investigating this but have not yet done that.

10. All the stuff (fb tracking pixel, etc.) you are used to just ‘putting in html’, you instead send as measurement protocol hit dimension and do ETL in google tag manager.

11. All the 3rd party stuff that demands to be executed client-side - you just don’t use that :D (or use, but wisely)

12. HTML - bussiness as usual.

13. So after page reload - double check if all requests are done/received from your own domain. Use curl on each of them to find header CF-cache-status: HIT. They have this ‘varied’ or similar status which means something I can’t remember, but I always fix stuff till ‘Hit’ :)

14. I guess that’s it. Enjoy your own fastest website in the world :)

I personally am 100% that site should work without JS (as well). Some UX might demand dom manipulations, so at least personally of having both. And for excluding GA - that's firstly a topic of specific business and it's philosophy. Technically if you collect server logs - you still have to get user's consent probably.

So glad to hear someone else feeling that way :) Thanks a lot for sharing - feel exactly the same way. We'll surely get there, fingers crossed for that happening sooner! :)

Kindply please also find a page identical to https://turboeshop.com/fastestpageintheworld/ implemented with next.js(ignore the domain name): https://gatsbyeshop.com . Of course the 'identical' is relative saying, as next.js has to bring on it's bundle.

Hey! Sure - been there done that https://stackoverflow.com/questions/57556599/how-to-render-n... :) Sapper, however, will not let you do that easily https://stackoverflow.com/questions/64507516/how-to-disable-... . I think with next.js it's somewhere in between - possbile, but not easy. And I totally buy the approach of being able to use and mix both according to the needs. My personal favorite for html+css composition is to develop components with react, deploy them on bit.dev and render with react.renderToStaticMarkup in backend with express.js Turboeshop.com is made exactly that way. BTW, there is identical website to https://turboeshop.com/fastestpageintheworld/ built with next.js(never mind the domain name): https://gatsbyeshop.com . Will update my initial comment as well.

Thanks a lot for your comment. I think it is important to note that max page speed is not a top priority in most of the cases. Banks, SaaS self service, etc. etc. - it's where it's probably not that much crucial. But - as always - it depends. Having that said - I am planning to develop 'fastest SPA in the world' toy demo with auth0.com, https://github.com/signalnerve/workers-auth0-example edge-side auth0 authentication and faunadb.com instantly-consistent cloud DB. The auth part of SPA sign in is just way too annoying for me. But yeah, hardly bank would ever sign for such stack, or at least a single part of it :)

I've have set page load monitoring for employees and clients in grafana. Been asked to add device/locations dimensions. That's OK to know and understand how tech stack influences customer's journey. But that info has no impact on looking for a ways to optimize site even further. On slower device - site will be somewhat proportionally slower, but will remains times/percentage faster than any alternative being crafted without taking care about performance - related aspects. Key to understand that once you put your website under Cloudflare or any other CDN, it'll always be very close to where you live. I do not know for sure but I think I live 1.5km from data center where Cloudflare is hosting their server :) Of course here comes the rendering part. But if you have minimum JS, and sane images, and class-based CSS (they say it's fastest) - what is it what can slow you down? If delivery is fast because of cdn, rendering is fast because of sticking to basics and best practices, I think you have it all covered.

Thanks a lot for sharing, will look into it for more tricks. Yet gtmetrix.com scores it at 1.0 s. Time-to-first-byte is 0.5 as CF gives 90-130ms TTFB out of box.

Very good point! Thanks - will take care of that! :)

It's physics, not perception. Just make your website fast.

Am currently consulting big ecommerce bussiness on how to improve page load. I made them this 'fastest page in the world' demo: https://turboeshop.com/fastestpageintheworld/ - kindly please check it out. And here is fastest page with Google Analytics: https://turboeshop.com/newstackonly/. 325 ms for fully loaded time CSS + images + HTML + JS + GA loaded + Measurement Protocol hits sent.

This is what fast website is: a) inline purged css; b) everything loaded from one domain, 100% cached. c)inlined js(vanilla + web component if you need one); d) inlined images up to 4kb; e) larger images loaded from cache from same domain. f) gtag.js and analytics.js -> from cache; g) Measurement protocol hits sent from async proxy on edge. h) 100% cloudflare cache hits; i) Cloudflare workers for dynamic bits; That's all what it takes. Don't read articles- just make it fast, it's really that simple :)

And as svelte was mentioned - if you want to improve a website that is bigger than your personal blog, you don't use svelte, react, gatsby or any other of that breed as it's impossible to do serious marketing with a website that's hydrated (svelte's web components is a wonderful thing though and is totally nice addition to marketing stack). I mean no insult to anyone with my strong opinions and would be glad to have discussions in comments.

UPD: Added note on Cloudflare & Cloudflare workers.

Thank you for sharing this! Out of curiosity, checked that Sphinx (my defaults docs engine) seems to be capable of doing this as well. https://sphinx-revealjs.readthedocs.io/en/latest/ , demo of generated presentation: https://attakei.github.io/sphinx-revealjs/ . Did not compare sphinx-revealjs with pandoc's coverage of reveal.js features though.

That is a rude comment. Why have you sticked with windows or mac os when they released 20 versions of their software? NT and 98, windows server, etc.? Because it does it's job, who cares that there are other versions that also works! I run influx stack in production for two years and had (almost) zero problems with it. Everything works, is being maintained and on the side the new cool stuff is being rolled out, what's the problem with that? Paul, as a happy user of influx, let me say - thank you guys for what you are creating!

Do you use any db connection wrappers around asyncpg? Like encode/databases or gino? Also important to note that SQLAlchemy 1.4 alpha with asyncpg support is realease and can be tried out(both SQLAlchemy core&orm modes support it). I myself evaluated all options of async postgress connection wrappers in fastapi project but reverted to... just using sync psycopg2 through sqla core. No very specific gains of async db connection for my use cases and sqlalchemy creator's comments on immaturity of async postgres drivers made my stick to what's battletested.

10 questions' animated form just to learn there is no free tier nor free trial? not too cool.

Wrote even visually very similar tool for myself last year. Also with vue/vuetify :) On the final step, where you have 'save', I have several buttons: "copy campaigns, adwords editor", "copy campaigns, bing editor", "copy ad groups, adwords editor", etc. That was really quick and intuitive way of transfering generated data to bing/adwords editor.

With the release of wrangler and new docs we finally have the router app starter template. I wanted to ask if you could go one step further and share the template which would include middleware functionality implemented. By middleware I refer to what middleware stands in Django web framework.

Many of the app functionality, such as language/locale based cookies, url-level a/b-tests, etc. is shared between all the routes, and it would be nice to have such logic described somewhere in separate place, not in the route handler functions. For non-pro developers like me that'd really help.

P.S. In case no one has mentioned this yet, community is really thankful for allowing multi-script for everyone, not only enterprise users. Enterprise features for free or 5$ - that's a very generous pricing, to say the least! Thanks.

Thanks for release and making such inovation affordable for all of us. Just to clarify on the new "multi-script" feature and "30 scripts" limitation:

- same worker scripts are shared between CF account level and workers.dev.

- script belongs to account, not domain.

- 30 scripts limit is for account (CF/workers.dev).

- Routes for domain are unlimited.

Are all of the above statements correct?

Thanks!

DevOps tool ansible UI platform Tower updates to the v2.0. New features: - sleaker UX; - realtime job status updates; - extended cloud support; - tower server monitoring functionality; - Red Hat support included; - More appropriate pricing for startups(99$/100 machine). 10 machines free tier remains.

"You'll earn upgrades as we move from genotyping to full sequencing" -- so AFAIK, right now 23andme are comparing your DNA data to the one of the human genome project and providing you with the percentage of how many people from genome project, having similar DNA sequences, had one disease or another. I wonder, once the sequencing advances, will the info provided by 23andme be detailed enough so to take the full advantage of the new methodologies of sequencing? In other words - will the science of genetics improve only in the interpretation of the DNA data, or in collecting more detailed DNA data as well?