Performance Issues 

Issue: Slow Editor Loading 

Symptoms:

• CKEditor takes long time to initialize
• Image browser slow to open

Causes:

1. Large number of files in file browser
2. Unoptimized image processing settings
3. Network latency
4. Browser resource constraints

Solutions:

1. Optimize Image Processing:

// LocalConfiguration.php
$GLOBALS['TYPO3_CONF_VARS']['GFX']['jpg_quality'] = 85;
$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_effects'] = false;  // If not needed

2. Reduce Maximum Dimensions:

RTE.default.buttons.image.options.magic {
    maxWidth = 1200  # Instead of 1920
    maxHeight = 800  # Instead of 9999
}

3. Limit File Browser Results:

Configure file mounts to show only relevant directories:

# User TSConfig
options.folderTree.uploadFieldsInLinkBrowser = 0
options.pageTree.showPageIdWithTitle = 0

Issue: Image Selection Dialog Slow 

Symptoms:

• Modal takes long time to open
• Thumbnails load slowly
• Browser becomes unresponsive

Causes:

1. Too many files in directory
2. Large unprocessed images
3. Missing thumbnail cache

Solutions:

1. Organize Files into Subdirectories:

   • Group images by category
   • Use year/month folder structure
   • Keep directories under 100 files
2. Pre-generate Thumbnails:

# Generate missing thumbnails
./vendor/bin/typo3 cleanup:missingfiles
./vendor/bin/typo3 cleanup:previewlinks

3. Optimize File Storage:

# Limit file selection to specific folders
options.defaultUploadFolder = 1:fileadmin/user_upload/

Issue: Slow Page Load Due to Images 

Symptoms:

• Pages load slowly
• Large images not processed
• High bandwidth usage

Causes:

1. Original large images served instead of processed versions
2. No image compression
3. Missing lazy loading
4. Too many images on page

Solutions:

1. Enable Image Processing:

// LocalConfiguration.php
$GLOBALS['TYPO3_CONF_VARS']['GFX'] = [
    'processor_enabled' => true,
    'processor' => 'ImageMagick',
    'jpg_quality' => 85,
];

2. Configure Reasonable Maximum Dimensions:

RTE.default.buttons.image.options.magic {
    maxWidth = 1920
    maxHeight = 1080
}

3. Implement Lazy Loading:

lib.parseFunc_RTE.tags.img {
    current = 1
    preUserFunc = Netresearch\RteCKEditorImage\Controller\ImageRenderingController->renderImageAttributes
    stdWrap.replacement {
        10 {
            search = <img
            replace = <img loading="lazy"
        }
    }
}

4. Enable Browser Caching:

# .htaccess
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpeg "access plus 1 year"
    ExpiresByType image/png "access plus 1 year"
    ExpiresByType image/webp "access plus 1 year"
</IfModule>

Issue: Excessive Bandwidth Usage 

Symptoms:

• High server bandwidth consumption
• Slow site on mobile devices
• Large page sizes

Solutions:

1. Use WebP Format:

// LocalConfiguration.php
$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_allowUpscaling'] = false;
$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_stripColorProfileByDefault'] = true;

2. Implement Progressive JPEG:

$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_interlace'] = true;

3. Compress Images:

$GLOBALS['TYPO3_CONF_VARS']['GFX']['jpg_quality'] = 80;

Issue: Image Processing Timeouts 

Symptoms:

• 500 errors when uploading images
• Processing hangs
• Timeouts in backend

Causes:

1. Insufficient PHP memory
2. Low execution time limits
3. Slow image processor
4. Very large source images

Solutions:

1. Increase PHP Limits:

// php.ini or LocalConfiguration.php
memory_limit = 512M
max_execution_time = 300
upload_max_filesize = 20M
post_max_size = 20M

2. Optimize Image Processor:

// LocalConfiguration.php
$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_path_lzw'] = '';
$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_colorspace'] = 'RGB';

3. Limit Upload Size:

# Page TSConfig
RTE.default.buttons.image.options.magic {
    maxFileSize = 5000  # 5MB in KB
}

Issue: Processed Images Directory Growing 

Symptoms:

• Large _processed_/ directory
• Disk space issues
• Duplicate processed images

Causes:

1. Old processed images not cleaned up
2. Multiple versions of same image
3. Unused processed files accumulating

Solutions:

1. Clean Old Processed Files:

# Remove processed files older than 30 days
find fileadmin/_processed_ -type f -mtime +30 -delete

2. Implement Automated Cleanup:

// LocalConfiguration.php
$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_allowTemporaryMasksAsPng'] = false;

3. Schedule Cleanup Task:

Create a scheduler task to regularly clean old processed images:

# Cron job example (runs weekly)
0 2 * * 0 find /path/to/fileadmin/_processed_ -type f -mtime +30 -delete

Issue: Large Database Size 

Symptoms:

• Database growing rapidly
• sys_refindex table very large
• Slow queries

Causes:

1. Excessive soft reference entries
2. Orphaned records
3. Unoptimized indexes

Solutions:

1. Rebuild Reference Index:

./vendor/bin/typo3 referenceindex:update

2. Clean Up Orphaned Records:

-- Find images in deleted content
SELECT uid, bodytext
FROM tt_content
WHERE deleted = 1 AND bodytext LIKE '%data-htmlarea-file-uid%';

3. Optimize Tables:

OPTIMIZE TABLE sys_refindex;
OPTIMIZE TABLE tt_content;

Issue: Slow Reference Index Updates 

Symptoms:

• Reference index update takes long time
• High CPU usage during updates

Solutions:

1. Batch Update References:

# Update in smaller batches
./vendor/bin/typo3 referenceindex:update --check

2. Schedule Off-Peak Updates:

Run reference index updates during low-traffic periods:

# Cron job (runs at 3 AM)
0 3 * * * /path/to/vendor/bin/typo3 referenceindex:update

Issue: Excessive Cache Invalidation 

Symptoms:

• Caches cleared too frequently
• Slow page regeneration
• High server load

Causes:

1. Aggressive cache clearing
2. Content changes trigger full cache clear
3. Misconfigured cache tags

Solutions:

1. Optimize Cache Configuration:

// LocalConfiguration.php
$GLOBALS['TYPO3_CONF_VARS']['SYS']['caching']['cacheConfigurations']['pages'] = [
    'backend' => \TYPO3\CMS\Core\Cache\Backend\RedisBackend::class,
    'options' => [
        'hostname' => 'localhost',
        'database' => 0,
        'port' => 6379,
    ],
];

2. Use Cache Tags Effectively:

config {
    cache_period = 86400
    sendCacheHeaders = 1
}

3. Implement Selective Cache Clearing:

# Clear only specific cache groups
./vendor/bin/typo3 cache:flush --group=pages

Issue: Slow Image Loading from CDN 

Symptoms:

• Images load slowly despite CDN
• Inconsistent loading times
• Failed CDN requests

Solutions:

1. Configure Proper CDN:

config {
    absRefPrefix = /
    baseURL = https://cdn.yourdomain.com/
}

2. Use HTTP/2:

Ensure your server supports HTTP/2 for multiplexing

3. Implement Preconnect:

<link rel="preconnect" href="https://cdn.yourdomain.com">
<link rel="dns-prefetch" href="https://cdn.yourdomain.com">

Performance Monitoring 

1. Enable TYPO3 Admin Panel:

config.admPanel = 1

2. Monitor Image Processing:

# Check processing time
./vendor/bin/typo3 backend:test:imageprocessing

3. Track Page Load Times:

Use browser DevTools Network tab to monitor:

• Image load times
• TTFB (Time to First Byte)
• Total page load time

Database Query Profiling 

-- Find slow queries
SHOW PROCESSLIST;

-- Analyze reference index queries
EXPLAIN SELECT * FROM sys_refindex WHERE tablename='tt_content';

Image Processing Profiling 

# Time image processing
time ./vendor/bin/typo3 backend:test:imageprocessing

# Monitor processed files
watch -n 5 "ls -lh fileadmin/_processed_/ | wc -l"

Image Optimization Checklist 

✓ Configure reasonable maximum dimensions:

RTE.default.buttons.image.options.magic {
    maxWidth = 1920
    maxHeight = 1080
}

✓ Enable image processing:

$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_enabled'] = true;

✓ Set appropriate JPEG quality:

$GLOBALS['TYPO3_CONF_VARS']['GFX']['jpg_quality'] = 85;

✓ Implement lazy loading:

<img loading="lazy" src="..." />

✓ Use browser caching:

ExpiresActive On
ExpiresByType image/jpeg "access plus 1 year"

✓ Regular cleanup of processed files:

find fileadmin/_processed_ -type f -mtime +30 -delete

✓ Monitor disk space and database size

✓ Optimize images before upload (recommend to editors)

Server Optimization Checklist 

✓ Adequate PHP memory: 512M minimum

✓ Fast image processor: ImageMagick or GraphicsMagick

✓ Redis/Memcached for caching

✓ HTTP/2 support enabled

✓ CDN for static assets

✓ Regular database optimization

✓ Scheduled cleanup tasks