Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Using CDNs To Perform SEO On The Edge

DDavydoff
September 20, 2019
95

Using CDNs To Perform SEO On The Edge

DDavydoff

September 20, 2019
Tweet

Transcript

  1. How serverless
    technologies can help SEOs
    overcome legacy (and
    modern) tech obstacles
    Dan Taylor // SALT.agency
    SLIDESHARE.NET/DANTAYLOR29
    @TAYLORDANRW

    View full-size slide

  2. /about/
    Senior Technical Consultant @
    SALT.agency
    https://sloth.cloud
    https://hreflangchecker.com
    https://salt.agency
    https://techseopodcast.com

    View full-size slide

  3. Edge SEO means using edge computing technologies to
    create new SEO implementation methods, testing, and
    research processes outside of the current parameters
    in which we operate.

    View full-size slide

  4. OOTB CDN Benefits
    • Speed optimization of content delivery
    • Including payload optimization & compressions
    • Bandwidth savings
    • Content accessibility / uptime reliability
    • Security benefits, i.e. WAF / DDoS Mitigation
    • Reverse proxy other platforms to subfolders etc
    • “Edge SEO” stuff

    View full-size slide

  5. Why is this needed?
    • Congested development queues // long lead times
    • Lack of “business buy in” to action SEO fixes as a priority
    • Platforms with restrictions
    • Random Google support changes
    • Builds not scoped properly
    • Code freezes

    View full-size slide

  6. Robots.txt Modding Yes Yes* Yes
    Redirects Yes Yes* Yes
    AB Testing Yes Yes* Yes
    Hreflang Injection Yes Yes* Limited
    Security Headers Yes Yes* Yes
    “Logging” Yes Yes* No Need
    Dynamic JS
    Prerendering
    Yes Yes* Yes
    Meta Data Yes Yes* Yes

    View full-size slide

  7. Example worker codes/uses
    • Implement redirects
    • AB testing
    • Overwrite hardcoded meta data / HTML elements
    • Integration in the pre-rendering of JavaScript
    • Implement Hreflang
    • Pseudo log file collection
    • Dynamic meta data

    View full-size slide

  8. HTML declared title tag:
    ODN Script:
    Result:

    View full-size slide

  9. Pseudo log file collection
    Not all platforms all log file collection…
    Sometimes getting hold of logs isn’t easy due to gatekeepers.

    View full-size slide

  10. •Access to edit robots.txt
    •Access to pull pseudo log files
    •Customise server headers
    A grey cloud means your web traffic is not running
    through Cloudflare.

    View full-size slide

  11. AB Testing
    • ABCD test URLs by directing traffic via the CDN
    • Monitor page level metrics via Google Analytics / Google
    Data Studio Reports
    • Requires pages to “be live”
    Live Example:
    https://dantaylor.online/sloth-ab

    View full-size slide

  12. Dynamic Prerendering of JavaScript
    Prerender JavaScript by rendering cached versions of the site
    periodically, rather than on a per request basis.
    Can reduce costs for prerendering JS server side, and complies
    with Google’s recommended implementation of dynamic
    rendering, by switching between client-side and pre-rendered
    content for specific user-agents.

    View full-size slide

  13. Source: https://developers.google.com/search/docs/guides/dynamic-rendering

    View full-size slide

  14. Step 1 – Halt, who goes there?
    Request Comes In

    View full-size slide

  15. Step 2 – =IF(”Googlebot|Bingbot…”, P1, P2)
    Check Cache For
    Prerendered Page
    Client Side Render
    Return It
    No Cache

    View full-size slide

  16. Step 3 – What Happens If No Cache?
    Trigger Prerendering.
    1. Wait and return the prerendered page – but monitor the
    time it takes, if it takes 7-seconds, negative impact.
    2. We could return the page after 1-second of prerendering,
    but likely to be useless.

    View full-size slide

  17. Worker Solution When Caught Short
    We return https://httpstatuses.com/503 with Retry-
    After; this has not been tested in real world AFAIK, but
    the idea would be to tell crawler to attempt again in 10
    seconds for that page

    View full-size slide

  18. Cold Cache Issues
    To solve issue of cold caches, we have a batch job,
    checking cache for stale entries and prerendering them,
    and to seed cache we can either use a sitemap or crawl
    our own site.

    View full-size slide

  19. New technologies require new processes.

    View full-size slide

  20. Pros (Development)
    •Workers are written in JavaScript/WASM
    •One-click deployment/pullback
    •Next to zero dev ops required
    •Can be verified and monitoring through existing
    tools/methods

    View full-size slide

  21. Cons (Development)
    • Potential to affect and impact all requests between client and
    server
    • Potential to add latency and slow page load times, depending
    on implementation (our testing has shown between 10ms
    and 50ms latency)
    • Potential to introduce front-end bugs that are difficult to
    debug when it is unclear what is being modified/injected
    through stream transformation

    View full-size slide

  22. Internal Processes & Challenges
    •Responsibility and accountability
    •Change management
    •Development and release management
    •Debugging process
    •Security
    •Compliance (legal, privacy, GDPR)

    View full-size slide

  23. Restricting access to your CDN
    Access to your Cloudflare, Akamai, or Incapsula account
    needs to be locked down within the organisation
    because even without Cloudflare Workers being
    enabled, you can still do a lot of damage through the
    Cloudflare dashboard if you don’t know what you’re
    doing.

    View full-size slide

  24. Further Reading
    • https://blog.cloudflare.com/diving-into-technical-seo-
    cloudflare-workers/
    • https://searchengineland.com/service-workers-and-seo-seo-
    for-developers-311292
    • https://salt.agency/blog/how-to-use-cdns-to-improve-seo-
    on-the-edge/

    View full-size slide

  25. Thank You!
    @taylordanrw @salt_agency https://salt.agency

    View full-size slide