updated NeMe

colak · 2025-11-10 05:41:17

Firstly big thanks to all the people who offered their advice and pointers.

Although you may not notice any difference, especially if you are visiting NeMe with your cache, this was a major update which saves over 1Mb for each page load. As some of you may have noticed, I’m digging into php and js with various successes but also complete failures.

The latest update gets rid of jquery, the responsive slides plugin, and others, and replaces them with a vanilla js I have authored and a few lines of css.

In my setup everything behaves as intended on large screens but do let me know if you think that I broke the internet again.

Issues

I hope that my css for backward compatibility of the aspect-ratio style works. I have no way of checking it.
I have no idea why the slide shows do not load on mobile devices and on smaller width browsers as it is working just fine in my minimal test.

phiw13 · 2025-11-10 07:40:45

For your slideshow on small screens, 3 issues

.grid_18.slides { display: block} – it is currently set to inline, in default.css, line 48
.container_24 .grid_18 { width: 74%; } – not sure that is intended for that slideshow (.default.css), on small screens. there is another selector that set this to width:100% but is overriden by the above?
the li also has a left margin perhaps ul.carousel li { margin-left: 0;}

Your front page otherwise works well on my luddite iPhone (iOS 15).

Pat64 · 2025-11-10 07:58:48

@Yiannis

On your home page, you can safely compress your little script (with the help of this tool: https://www.digitalocean.com/community/tools/minify):

<script>document.addEventListener("DOMContentLoaded",(function(){document.body.className=document.body.className.replace(/\bno-js\b/,"js")}));</script>

Therefore, you will be able to remove “script” from the protected tags functionality when using pat_speeder without any problem. ;)

Here is your Google Page Speed Insights results: https://pagespeed.web.dev/analysis/https-www-neme-org/db0k2q24n9

Last edited by Pat64 (2025-11-10 08:05:40)

colak · 2025-11-10 08:24:40

Thanks so much Patrick and Philippe.

It seems that I’m 90% there although I’m yet to load the slide show in mobile safari and ff which is possibly a cache issue. I have temporarily changed the expiring time in my htaccess to 1 second but no luck yet. It works just fine in mobile onion browser.

~~The only issue left is with the slideshow in the home page.~~

The css as Philippe has noticed, gives the .grid_18 class a 74% width, but further down I have another rule under media screen and (max-width: 960px) which states that .slides{float:none;width:96%;clear:both; margin:auto} but it just doesn’t behave. Any ideas?

Solved!

phiw13 · 2025-11-10 08:41:31

colak wrote #341137:

Thanks so much Patrick and Philippe.

[…]

For the Safari caching issue – it has a tendency to be a wee little agressive at times, that drives me crazy.

Open Settings > Safari. Scroll down to the bottom/end , “Advanced” > Website Data. Search for neme.org and delete (slide to right).
Back in Safari, if your neme.org page is still open you’ll see it being reloaded. It works for me 99% of the time.

Checked here and the slideshow is OK now

PS – Thank you for making the text larger than before. The old eyes appreciate it.

colak · 2025-11-10 10:20:43

phiw13 wrote #341138:

For the Safari caching issue – it has a tendency to be a wee little agressive at times, that drives me crazy.

Open Settings > Safari. Scroll down to the bottom/end , “Advanced” > Website Data. Search for neme.org and delete (slide to right).
Back in Safari, if your neme.org page is still open you’ll see it being reloaded. It works for me 99% of the time.

Checked here and the slideshow is OK now

Thanks so much! Mobile cache is a real pain.

PS – Thank you for making the text larger than before. The old eyes appreciate it.

Mine too. I just couldn’t read it any more:)

colak · 2025-11-10 10:24:30

Pat64 wrote #341136:

@Yiannis

On your home page, you can safely compress your little script (with the help of this tool: https://www.digitalocean.com/community/tools/minify):

<script>document.addEventListener("DOMContentLoaded",(function(){document.body.className=document.body.className.replace(/\bno-js\b/,"js")}));</script>...

Therefore, you will be able to remove “script” from the protected tags functionality when using pat_speeder without any problem. ;)

Here is your Google Page Speed Insights results: https://pagespeed.web.dev/analysis/https-www-neme-org/db0k2q24n9

Patrick, thanks for the compressed js. Unfortunately I cannot remove script from pad speeder as I have a page which is all uncompressed javascript that I update regularly.

jakob · 2025-11-10 15:16:51

colak wrote #341140:

Patrick, thanks for the compressed js. Unfortunately I cannot remove script from pad speeder as I have a page which is all uncompressed javascript that I update regularly.

If it’s just one page, maybe you could use <txp:if_article_id id="123" not>…</txp:if_article_id> (or <txp:if_section not>… if it’s a section) to exclude that one page (/section) from being compressed.

colak · 2025-11-10 15:41:04

jakob wrote #341141:

If it’s just one page, maybe you could use <txp:if_article_id id="123" not>…</txp:if_article_id> (or <txp:if_section not>… if it’s a section) to exclude that one page (/section) from being compressed.

I know, but as I minimised all js in my pages now, all I will save is a couple of line-breaks so it’s not worth it.

Pat64 · 2025-11-10 15:51:31

@Yannis

Now you got an honorable Google Page Spped Insights score of… 100/100 (in Mobiles and Desktop):

https://pagespeed.web.dev/analysis/https-www-neme-org/blun7e7yr2?form_factor=mobile

Good job!

phiw13 · 2025-11-11 11:31:54

You should investigate / improve the link color used in your menu (as well as the hamburger icon) on small screen devices. Against a black background I get a contrast-ratio of ~3.5 Which is really below accessibility recommendations. Against the dark grey on alternate rows it is even worse. The red colour used when tapping the link (a:active, I guess) over the menu would be a better choice. Or white ? The colour of the inline links inside articles is fine (contrast-ratio ~5.4).

jakob · 2025-11-11 15:08:31

colak wrote #341132:

this was a major update which saves over 1Mb for each page load.

It was worth it alone for that amazing reduction in page load! How did you save so much? Is that perhaps through using lazy loading so that fewer images are downloaded on first load?

You also have an incredible amount of information on the site – a real testimony to the many, many things you do at NeMe!

Textpattern CMS

Textpattern CMS support forum

#1 2025-11-10 05:41:17

updated NeMe

#2 2025-11-10 07:40:45

Re: updated NeMe

#3 2025-11-10 07:58:48

Re: updated NeMe

#4 2025-11-10 08:24:40

Re: updated NeMe

#5 2025-11-10 08:41:31

Re: updated NeMe

colak wrote #341137:

#6 2025-11-10 10:20:43

Re: updated NeMe

phiw13 wrote #341138:

#7 2025-11-10 10:24:30

Re: updated NeMe

Pat64 wrote #341136:

#8 2025-11-10 15:16:51

Re: updated NeMe

colak wrote #341140:

#9 2025-11-10 15:41:04

Re: updated NeMe

jakob wrote #341141:

#10 2025-11-10 15:51:31

Re: updated NeMe

#11 2025-11-11 11:31:54

Re: updated NeMe

#12 2025-11-11 15:08:31

Re: updated NeMe

colak wrote #341132:

Board footer