Preload and Prefetch Optimization for 1C-Bitrix
Why Preload Is Critical for 1C-Bitrix
Imagine a visitor lands on your Bitrix-based e-commerce store, and the page takes 5 seconds to load. The critical request chain blocks rendering: every HTML, CSS, font, and script loads sequentially. The browser downloads HTML, parses it, finds <link rel="stylesheet"> on line 5, fetches CSS, waits, parses CSS, finds fonts in @font-face, fetches fonts – this is the critical request chain that blocks rendering. We solve this with preload, prefetch, and critical CSS. Our experience spans over 20 projects where we cut time to first paint (FCP) by 30–40% and LCP by 25%. According to the Resource Hints specification, preload tells the browser about needed resources before the parser discovers them. Prefetch loads resources for the next page. Preload outperforms ordinary loading by 2× for FCP.
Comparison of Preloading Methods
| Method |
Priority |
Use Case |
Example |
| preload |
High |
Critical resources for the current page |
CSS, fonts |
| prefetch |
Low |
Resources for the next page |
JS for the next catalog section |
| preconnect |
Medium |
Establish TCP and TLS connections |
CDN, Yandex.Metrica |
How to Speed Up Navigation with Prefetch
If a user is on the homepage, there's a high probability they'll navigate to the catalog. Prefetching the catalog's main JS and the HTML page /catalog/ puts it in the browser cache – the transition becomes instantaneous. However, this only works if the page has proper caching headers.
| Typical Resources for Preload |
Recommendation |
| Main template CSS |
Always preload |
| Fonts (woff2) |
Preload with crossorigin |
| Core JS (jquery, core.js) |
Preload when needed |
How to Add Preload to a Bitrix Template: Code and Example
The site template in Bitrix is at /bitrix/templates/[template_name]/header.php. Add the following inside <head> before main tags:
<?php
// Get file version for cache busting
$cssVersion = filemtime($_SERVER['DOCUMENT_ROOT'] . '/bitrix/templates/.default/styles.css');
$jsVersion = filemtime($_SERVER['DOCUMENT_ROOT'] . '/bitrix/js/main/core/core.js');
?>
<head>
<meta charset="utf-8">
<!-- Preload critical CSS (rendering is blocked without it) -->
<link rel="preload" href="/bitrix/templates/.default/styles.css?v=<?=$cssVersion?>"
as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript>
<link rel="stylesheet" href="/bitrix/templates/.default/styles.css?v=<?=$cssVersion?>">
</noscript>
<!-- Preload font (as="font" is mandatory, otherwise wrong priority) -->
<link rel="preload" href="/bitrix/templates/.default/fonts/roboto.woff2"
as="font" type="font/woff2" crossorigin>
<!-- Preconnect to external resources -->
<link rel="preconnect" href="https://mc.yandex.ru">
<link rel="preconnect" href="https://www.googletagmanager.com">
<!-- DNS-prefetch as fallback for older browsers -->
<link rel="dns-prefetch" href="//mc.yandex.ru">
</head>
Programmatic Preload via the Bitrix API
Bitrix provides methods to manage Link headers via the \Bitrix\Main\Page\Asset class:
// In a component or template
$asset = \Bitrix\Main\Page\Asset::getInstance();
// Preload a JS file
$asset->addJs('/bitrix/js/ui/ui.js', [
'rel' => 'preload',
'as' => 'script'
]);
// Preload CSS
$asset->addCss('/bitrix/templates/.default/critical.css', [
'rel' => 'preload'
]);
Via HTTP header from the OnPageStart event handler:
AddEventHandler('main', 'OnPageStart', function() {
header('Link: </bitrix/templates/.default/styles.css>; rel=preload; as=style', false);
header('Link: </bitrix/templates/.default/fonts/roboto.woff2>; rel=preload; as=font; crossorigin', false);
});
Critical CSS for Bitrix: Why It Delivers 40% Faster Loads?
The biggest boost comes from inline critical CSS – styles needed for above-the-fold content embedded directly in the HTML. This eliminates the blocking CSS request entirely. In one project we cut LCP from 3.2s to 1.8s solely with critical CSS. Tool to extract critical CSS:
npm install -g critical
critical --base /var/www/bitrix/public_html \
--src index.html \
--css bitrix/templates/.default/styles.css \
--width 1300 --height 900 \
--inline --extract
Insert the resulting critical CSS into the Bitrix template inside a <style> tag in <head>, and load the main CSS asynchronously via preload with onload as shown above. Learn more about critical CSS.
Workflow: From Audit to Monitoring
-
Analyze the critical chain – Collect the waterfall of requests using Chrome DevTools, identify blocking resources. Typically we find 5–8 candidates.
-
Select resources for preload – Pick 3–5 critical files (CSS, fonts, core JS). For instance, on a project with a 50,000-product catalog, we preloaded the main CSS and fonts, cutting FCP from 2.8s to 1.7s.
-
Implementation – Add
<link> tags in header.php with version hashes or use the Asset API. For HTTP headers, hook into OnPageStart.
-
Prefetch for the next step – On the homepage, prefetch the catalog JS; on a product page, prefetch the cart JS. This reduces navigation time by up to 200 ms.
-
Critical CSS – Extract inline styles for above-the-fold, load main CSS asynchronously. The
critical tool generates CSS for a 1300x900 viewport.
-
Testing – Verify with Lighthouse, WebPageTest, check FCP and LCP metrics. Aim for a score of 95+.
-
Deploy and monitor – Roll out, monitor real performance via Web Vitals.
Common Mistakes and Our Guarantee
Based on our 5+ years with Bitrix and 20+ projects, we guarantee no regressions: every step is documented and backed up. Key mistakes we avoid:
-
Preload without
as – The browser doesn't know the resource type, loads it with wrong priority, and caches it separately. The resource is loaded twice: once via preload, again when the parser finds the <script> or <link> tag.
-
Preload fonts without
crossorigin – CORS requests to the same domain require crossorigin for fonts. Without it, the browser loads the font twice.
-
Too many preloads – Equal priority for everything means priority for nothing. Limit to 3–5 preloads per page for truly critical resources.
What's Included in Preload Configuration
When you order this service, you receive:
- Audit of the current critical request chain with a detailed report.
- Preload setup for CSS, fonts, and JS tailored to your catalog.
- Prefetch for next-step pages and resources.
- Critical CSS implementation with automatic generation.
- Performance testing (Lighthouse, WebPageTest) – achieving FCP < 1.5s and LCP < 2.5s.
- Documentation of all changes made.
- Guarantee of backward compatibility with Bitrix updates.
Timeline: 1 to 3 days. Pricing is customized per project, but the savings from speed gains can be hundreds of thousands of rubles per month through higher conversion rates and lower bounce rates. Our estimates show that for a site with 10,000 unique visitors per day, a 30% speed increase boosts conversion by 1–2%, generating additional revenue of 50,000 to 150,000 rubles per month. Contact us for a consultation and we'll help speed up your Bitrix. Request a performance audit today.
What Professional 1C-Bitrix Installation Includes
We start by checking innodb_buffer_pool_size. The default MySQL value (128 MB) is a death sentence for an online store with a catalog of 10,000+ items. We set 70–80% of available RAM on a dedicated server, 50% on VPS. This single setting speeds up the site by 2–3 times compared to the default. We'll assess your project in one day — get a consultation. Contact us to order turnkey installation with performance guarantee.
How to Choose Hosting and Edition for 1C-Bitrix Installation?
BitrixVM is a virtual machine with a pre-installed stack: nginx + Apache, PHP-FPM, MySQL/MariaDB, Sphinx, Push server. For VPS — the best start. Everything is already configured for Bitrix, including OPcache, log rotation, and firewall. Management via web panel on port 8890. Bitrix documentation recommends starting with BitrixVM for predictable performance.
VPS/VDS is the sweet spot. Minimum configuration for a medium online store: 2 vCPU, 4 GB RAM, SSD. Optimal: 4 vCPU, 8 GB RAM. OS: Ubuntu 22.04 or Debian 12. If not BitrixVM, we configure the stack manually for the task. Virtual hosting — only for business cards and landing pages. Requirements: PHP 8.0+, MySQL 5.7+ / MariaDB 10.0+, 512 MB RAM, .htaccess. 1C-Bitrix hosting partners guarantee compatibility. Dedicated server — for highload. Typical architecture: web server separate, database separate, Redis/Memcached separate. For Enterprise edition — web cluster with load balancer. Cloud (Yandex Cloud, VK Cloud, Selectel) — when load spikes: sales, seasonal peaks. Autoscaling via Managed Kubernetes or simple VM vertical scaling.
Choosing the edition is equally important. A common mistake: choosing "Small Business" for a store that grows to B2B with wholesale prices and three warehouses in six months. Upgrading to "Business" — pay the difference, data is not lost, but it's better to plan ahead. Our specialists select the edition for current tasks and with room for growth. For example, the "Business" license (about 35,000 RUB) pays off through multi-warehouse and 1C exchange, while the wrong choice can lead to a loss of up to 30,000 RUB monthly on excess resources.
| Edition |
For Whom |
Key Limitation |
| Start |
Business cards, landing pages |
No infoblocks 2.0, no trade catalog |
| Standard |
Corporate sites |
No e-commerce module |
| Small Business |
Small stores |
1 price type, 1 warehouse, no 1C exchange |
| Business |
Medium stores, B2B |
Multi-warehouse, multicurrency, CommerceML |
| Enterprise |
Highload, cluster |
Web cluster, CDN, multisite |
What Server Settings Are Critical for 1C-Bitrix?
Web Server and PHP
nginx as reverse proxy + Apache (mod_php) or nginx + PHP-FPM directly. The second option saves memory — Apache is not needed. But some Bitrix modules use .htaccess, so for compatibility we sometimes keep Apache. nginx configuration: fastcgi_read_timeout 300 — for long operations (1C import), client_max_body_size 1024m — large file uploads. Block access to .settings.php, .settings_extra.php, bitrix/.settings.php — they contain database passwords. Rewrite rules from urlrewrite.php — Bitrix generates them, but with nginx + PHP-FPM they need to be duplicated. PHP 8.0–8.2 with extensions: mbstring, curl, gd, xml, json, opcache, redis/memcached. Key php.ini settings: opcache.memory_consumption=256, opcache.max_accelerated_files=20000, max_execution_time=300, memory_limit=512M, upload_max_filesize=100M, post_max_size=128M.
Database and Caching
MySQL/MariaDB. Key my.cnf parameters: innodb_buffer_pool_size — 70–80% RAM, innodb_log_file_size=256M, tmp_table_size=256M, max_heap_table_size=256M, thread_pool_size — number of CPU cores. Encoding utf8mb4 mandatory, otherwise emoji and special characters break. Redis is preferable to Memcached for Bitrix — supports persistent connections and is more reliable. In production, Redis handles concurrent writes three times faster than Memcached under typical load. Configure in .settings_extra.php:
'cache' => ['value' => ['type' => ['class_name' => '\\Bitrix\\Main\\Data\\CacheEngineRedis']]]
'session' => ['value' => ['mode' => 'default', 'handlers' => ['general' => ['type' => 'redis']]]]
Example Redis configuration for Bitrix
sudo apt install redis-server
sudo systemctl enable redis
Add to .settings_extra.php as above.
SSL, Email, and Cron
SSL — Let's Encrypt via certbot in 90% of cases. Redirect HTTP → HTTPS (301), HSTS, TLS 1.2/1.3, OCSP Stapling. In Bitrix, switch to HTTPS in the main module settings. Email: abandon mail() — connect SMTP (Yandex.Mail for domain, Mail.ru for Business). Be sure to configure SPF, DKIM, DMARC. Without SPF, emails go to spam. Test deliverability via mail-tester.com — score 9+/10. Cron: Bitrix agents switch to system cron — * * * * * /usr/bin/php /var/www/bitrix/modules/main/tools/cron_events.php. Schedule 1C exchange (15–60 min), search reindex, backups (mysqldump + rsync, rotation 7+4), temporary file cleanup.
Security and Administration
File system: owner www-data, directories 755, files 644, upload 775. nginx blocks access to configuration files. Enable Bitrix Proactive Protection — WAF, activity control (block after 5 failed attempts), kernel integrity check. For admin panel: two-factor authentication via Google Authenticator or OTP, restrict access by IP via nginx for paranoid.
How Long Does 1C-Bitrix Installation and Configuration Take?
| Task |
Timeline |
| Installation on virtual hosting |
2–4 hours |
| Installation on VPS with stack configuration |
1–2 days |
| Installation on dedicated with architecture design |
2–5 days |
| SSL + email + cron + security |
1–2 days |
| Backup and monitoring setup |
0.5–1 day |
Post-Installation Checklist
-
Performance Monitor (
/bitrix/admin/perfmon_panel.php) — aim for 30+ points. Below 20 means serious configuration issues.
- System Check — automatic check of all parameters. Red items must be fixed, yellow — case by case.
- Security Scanner — check for typical vulnerabilities.
- PageSpeed Insights — TTFB < 200ms on VPS, LCP < 2.5s.
- Test 1C exchange — if integration is planned, verify CommerceML exchange before launch.
Additionally, check software versions, caching settings, cron operation, SSL certificate, SPF/DKIM/DMARC, access rights, delete default users and pages. For projects with 54-FZ, ensure fiscalization is configured via OFD provider.
Deliverables
- Fully configured server for 1C-Bitrix with MySQL, PHP, nginx optimization.
- Installed and activated license of the required edition.
- SSL certificate, email settings, cron and backups.
- Documentation: all configuration parameters, access credentials, cron tasks.
- Content manager training: how to log into admin panel, add products, upload images.
- Post-installation support for 30 days — consultations on settings.
Why Trust Professionals with Installation?
Incorrect installation means lost time and money. We've seen projects where a store on "Start" couldn't handle 50 visitors because innodb_buffer_pool_size wasn't configured. After migrating to VPS with correct configuration, the site "flew". Incorrect configuration can cost 30,000 RUB monthly due to excessive resource consumption. You get a ready-made architecture that scales. Order turnkey 1C-Bitrix installation — get a reliable platform for business growth. Contact us for a free consultation: we'll calculate the cost and time for your project. Over 7 years of experience, 120+ Bitrix projects implemented, including highload stores with million-item catalogs. Get in touch — we'll help configure Bitrix for your project.
