Front-End оптимизация круче, чем у гугла | Odessa Fronted Meetup #4

•

1 like•239 views

Просто красивым сайтом уже никого не удивишь, это норма. Более того, пользователи ожидают что сайт будет не только полезный, красивый, но и быстрый. Максим Мазурок делится тем, как сделать загрузку сайта быстрее и как научиться оптимизировать картинки лучше, чем у Google.

Technology

Front End OptimizationFEO
Maxim Mazurok Full Stack Web Developer @ CS Odessa

What is FEO?
Reduce requests
Reduce bytes
Accelerate render
LOAD FASTER

How to reduce requests?
CSS JS IMAGES
Sprites
Embedded
Replace with CSS
Bundle
Don’t use 3rd parties
Don’t use duplicates
Use only what is really needed for particular page

How to reduce bytes?
CSS HTML IMAGES
Format and size
Use SVG when possible
Minify SVG
Minify
Lossless compression
Use only what is really needed for particular page
JS

How to accelerate render?
CSS HTML IMAGES
Use appropriate sizeMinify
Use only what is really needed for particular page
JS
First view ValidateLess code
Frontend render
Async load
Progressive JPEG

Recently uploaded

Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)Julian Hyde

"Impact of front-end architecture on development cost", Viktor TurskyiFwdays

Exploring UiPath Orchestrator API: updates and limits in 2024 🚀DianaGray10

IESVE for Early Stage Design and PlanningIES VE

Speed Wins: From Kafka to APIs in Minutesconfluent

What's New in Teams Calling, Meetings and Devices April 2024Stephanie Beckett

To Graph or Not to Graph Knowledge Graph Architectures and LLMsPaul Groth

Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...CzechDreamin

PLAI - Acceleration Program for Generative A.I. StartupsStefano

UiPath Test Automation using UiPath Test Suite series, part 2DianaGray10

Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptxDavid Michel

JMeter webinar - integration with InfluxDB and GrafanaRTTS

Agentic RAG What it is its types applications and implementation.pdfChristopherTHyatt

Free and Effective: Making Flows Publicly Accessible, Yumi IbrahimzadeCzechDreamin

AI revolution and Salesforce, Jiří KarpíšekCzechDreamin

Powerful Start- the Key to Project Success, Barbara LaskowskaCzechDreamin

Knowledge engineering: from people to machines and backElena Simperl

UiPath Test Automation using UiPath Test Suite series, part 1DianaGray10

Demystifying gRPC in .Net by John StaveleyJohn Staveley

A Business-Centric Approach to Design System StrategyUXDXConf

Recently uploaded (20)

Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)

"Impact of front-end architecture on development cost", Viktor Turskyi

Exploring UiPath Orchestrator API: updates and limits in 2024 🚀

IESVE for Early Stage Design and Planning

Speed Wins: From Kafka to APIs in Minutes

What's New in Teams Calling, Meetings and Devices April 2024

To Graph or Not to Graph Knowledge Graph Architectures and LLMs

Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...

PLAI - Acceleration Program for Generative A.I. Startups

UiPath Test Automation using UiPath Test Suite series, part 2

Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx

JMeter webinar - integration with InfluxDB and Grafana

Agentic RAG What it is its types applications and implementation.pdf

Free and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade

AI revolution and Salesforce, Jiří Karpíšek

Powerful Start- the Key to Project Success, Barbara Laskowska

Knowledge engineering: from people to machines and back

UiPath Test Automation using UiPath Test Suite series, part 1

Demystifying gRPC in .Net by John Staveley

A Business-Centric Approach to Design System Strategy