asigno

Browser side resizing is far from best practice, this puts all the work on the client and slows the page load time. The correct image size for the viewport should be returned from the server.  As a minimum IPB should natively serve webp images and preferably to have integration with an image CDN such as https://www.imgix.com/ or https://cloudinary.com/

Safari 14 now supports .webp https://developer.apple.com/documentation/safari-release-notes/safari-14-beta-release-notes 

I run Ezoic, which are a publishing partner for Google premium ads. I make considerably more money with them than using Adsense directly. HOWEVER it slows your site, this may not be a tradeoff you want to make.

I too don't show ads to subscribed members, so their payment removes ads and increases page load speed.

Ezoic have a lot of tools for caching and increasing page speed, image optimization, critical css etc. but the key one as in caching isn't suitable for forums.

It'll serve an alternative, such as .jpg.

13 hours ago, Sheffielder said:

If someone with a Safari browser visits a site with Webp images on there does it still display the images but as Jpg or does it show a blank space where the image should be?

I'm using Cloudflare and there's an option to enable webp images but I dont' want to do it if someone with a non supported browser can't see my images?

Cloudflare will only serve .webp to browsers which support it.

I've just received confirmation from an Apple Webkit engineer it's coming to Safari too.

@h2ojunkie It'll actually be about 85% of web traffic come Jan.

https://gs.statcounter.com/browser-market-share/desktop/worldwide

Does anyone know if this is being used with 4.5?

On 10/25/2019 at 4:13 AM, Morgin said:

When you say "2 custom - user defined - lookup table" do you mean you added a new table to your DB to do group lookups for ezoic?

No, I have added JS to the template to send the group ID to a JS variable. I then use a lookup table in GTM to read that variable and choose whether to set the cookie to not show ads.

<script>
var groupId = {expression="\IPS\Member::loggedIn()->member_group_id"};
</script>

PM Sent

It's all handled through Ezoic.

On 7/17/2019 at 10:33 PM, AlexWebsites said:

For anyone using Ezoic, do you end up using your own adsense account and still see earnings in adsense or is it all through ezoic? I'm currently using adsense directly because I had too many styling issues with auto ads and didn't see a difference in earnings. 

I use the mediation app in Ezoic which allows me to still run my own adsense through the Ezoic bid system. However I've only make a few dollars though adsense as it is nearly always outbid by the premium ads through Google's display network through Ezoic.

You can manually place the Ezoic placeholders so you have full control over their positioning.

You make considerably more revenue through Ezoic, however it considerably slows your site down too. If you have a static site (non IPB) you can use their caching and site speed functionality where it wouldn't be an issue. 

Hi

both 1&2 are variables, 1 custom js variable, 2 custom - user defined - lookup table.

3. is a custom html tag

The code is all there to do it for free, are you already using Google Tag Manager (GTM)?

I set a cookie to certain user groups, Ezoic then don't display ads to those browsers with cookies.

I use GTM to set the cookie on login.

1. I have a custom JS variable, which returns the member group:

function() {
 return window.groupId 
}

2. I have a lookup table which then changes the output as it's just the DB number of the group and I'd like it readable

3. Then I have a custom HTML tag to create a cookie with noAdverts = true

<script>
    var memberType = {{Lookup table - Group ID}};
    if (memberType === 'Admin' || memberType === 'Moderator' || memberType === 'YOC Member' || memberType === 'Supporter' || memberType === 'Corporate') {
  var expirationTime = 7776000; // THREE month in seconds
        expirationTime = expirationTime * 1000; // Converts expirationtime to milliseconds
        var date = new Date();
        var dateTimeNow = date.getTime();
        date.setTime(dateTimeNow + expirationTime); // Sets expiration time (Time now + one month)
        var expirationTime = date.toUTCString(); // Converts milliseconds to UTC time string
        document.cookie = "noAdverts = true; expires=" + expirationTime + "; path=/; domain=." + location.hostname.replace(/^www\./i, ""); // Sets cookie for all subdomains
    }  
</script>

4. Ezoic's tech team make a change their end to only allow ads to be served to non cookied browsers

It's not perfect, as I didn't bother to set a script to remove the cookie on logout. But I also didn't want those users to see ads if they did log out, so set a 3 month expiry.

It's possible for anyone to manually create the same cookie value and they wouldn't see ads, but I think it's very unlikely for someone to do this.

@bfarber No it's live now if you've downloaded the latest v76.

The BBC have just done a quick case study on it as below:

Chrome's native lazy loading is now live on Chrome 76

https://web.dev/native-lazy-loading

Please can we have this enabled as default with a fall back for other browsers.

Not that I remember, I've double checked my template files and I don't have the XFF header and don't have issues.

Maybe it's worth turning off any caching and seeing if that resolves it, could be an issue with how the cache has been set up.

Hi @Unlucky I'm not having any issues, I'm using the "Trust IP addresses provided by proxies?" and have Ezoic deployed through Cloudflare.

If you use the XFF header it needs to be on every page of the site so you'll need to add it to the head of a template file which is used across all pages.

Another reason for an IPB app 😎

@bfarber check the animated demo on the home page of https://www.imgix.com/ 

They work completely different to a CDN such as Clouldfront, in that they allow one image to be dynamically rescaled, optimized and format served depending on the device/browser and connection speed.

10 hours ago, bfarber said:

As it happens, this is on an internal discussion tracklist - but there's nothing else to report right now. I can't say if support will be included in any specific upcoming release yet.

Has there been any discussion around support of Image CDNs such as https://cloudinary.com/ or https://www.imgix.com/

19 hours ago, opentype said:

The point was: background images with known dimensions are not needed to start the page rendering. That’s was the only point of that sentence. 

But the page can't start rendering until the CSS file has been parsed. It's actually something I want to get around to testing, did you try it both ways?

Edit: just found example of lazy loading background images https://toad.js.org/

On 2/25/2019 at 8:39 PM, opentype said:

SuperBlocks only uses container background images, which don’t slow down page rendering and then the browser fills in the empty slots dynamically. That already works nicely. 

Images declared in the CSS will mean it takes longer for the browser to parse the CSS file delaying the loading of the visible page. If they were img src tags the requests would be made as the HTML is parsed so the visible page can load earlier. Why do you say they don't slow down rendering?

FYI

With the introduction of Dark Mode in macOS Mojave last year, web developers have been asking for support in Safari to style web content that matches the system appearance. With the Safari 12.1 update in macOS 10.14.4, dark mode support in WebKit has arrived.

https://webkit.org/blog/8840/dark-mode-support-in-webkit/

Android Q will feature dark mode

https://www.engadget.com/2019/05/07/android-q-google-IO-2019-dark-mode/