# Optimasi Performa & SEO Bawaan

Tema Xionic dibangun dengan standar performa Core Web Vitals tinggi dan optimasi mesin pencari bawaan tanpa harus bergantung pada puluhan plugin tambahan.

# 1. Critical CSS Inlining

Untuk mencegah fenomena render-blocking dan Cumulative Layout Shift (CLS):

• File assets/css/critical.css dibaca dan di-injeksi langsung sebagai tag <style id="xionic-critical-css"> di <head>.
• Seluruh elemen penting Above-the-Fold (seperti layout header, navigasi dasar, container utama, dan hero) dirender secara instan saat byte HTML pertama diterima peramban.

# 2. Asynchronous CSS Swap

Stylesheet sekunder tema (Bootstrap, Font icons, dan stylesheet utama non-kritis) dimuat menggunakan teknik modern non-blocking:

<link rel="preload" href="..." as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="..."></noscript>

# 3. Automated Script Deferring

Semua skrip JavaScript yang didaftarkan oleh tema otomatis disisipi atribut defer melalui filter scriptloadertag. Hal ini mencegah penundaan rendering DOM saat script JavaScript diunduh.

# 4. Self-Hosted Google Fonts

Font utama tema (Inter dan Playfair Display) di-host secara lokal di direktori assets/fonts/ dengan format modern .woff2.

• Memangkas lookup DNS pihak ketiga ke server fonts.googleapis.com.
• Memenuhi regulasi privasi internasional (GDPR).
• Kecepatan muat tipografi lebih stabil.

# 5. Optimasi Gambar Cerdas (ImageOptimizer)

Kelas ImageOptimizer (core/Setup/ImageOptimizer.php) mengelola:

• Otomatisasi atribut srcset dan sizes untuk rendering resolusi responsif.
• Penambahan atribut decoding="async" secara global pada gambar konten.
• Atribut lazy loading bawaan browser (loading="lazy").
• Konversi gambar otomatis ke format WebP generasi baru jika ekstensi imagick aktif di server.

# 6. Structured Data Schema Markup (JSON-LD)

Framework secara otomatis menghasilkan metadata terstruktur Schema.org berformat JSON-LD pada tag <head>:

• WebSite: Termasuk Sitelinks Searchbox.
• Organization: Nama perusahaan, logo, dan URL profil media sosial.
• Article: Judul artikel, nama author, tanggal penerbitan, tanggal pembaruan, dan thumbnail.
• BreadcrumbList: Navigasi rekam jejak halaman yang ramah mesin pencari.
• FAQPage: Struktur tanya-jawab otomatis jika modul CPT FAQ aktif.

# 7. SEO Meta Tag Manager

Xionic memiliki engine meta tag terintegrasi untuk menangani tag OpenGraph (Facebook, LinkedIn) dan Twitter Cards.