PHPackages zeroseven/pictureino - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Image & Media](/categories/media) 4. / 5. zeroseven/pictureino ActiveTypo3-cms-extension[Image & Media](/categories/media) zeroseven/pictureino ==================== Responsive images – fully automated. No setup required. Boost PageSpeed and SEO with lazy loading and modern WebP delivery v1.2.1(6mo ago)41.6k↓50%3[6 issues](https://github.com/zeroseven/pictureino/issues)[6 PRs](https://github.com/zeroseven/pictureino/pulls)GPL-2.0-or-laterPHPPHP >=8.1CI passing Since Apr 23Pushed 5mo ago3 watchersCompare [ Source](https://github.com/zeroseven/pictureino)[ Packagist](https://packagist.org/packages/zeroseven/pictureino)[ RSS](/packages/zeroseven-pictureino/feed)WikiDiscussions master Synced 1mo ago READMEChangelog (4)Dependencies (6)Versions (23)Used By (0) Pictureiño – when your images size themselves ============================================= [](#pictureiño--when-your-images-size-themselves) **Responsive Images Done Right in TYPO3:** Pictureiño intelligently calculates the **ideal image dimensions** based on real viewport sizes and usage patterns. It learns from request data over time and adapts its sizing logic to serve only what’s needed – no more, no less. Images are delivered in **pixel-perfect dimensions**, as **modern WebP**, with **lazy loading** and **retina support** out of the box. This fully automated approach eliminates the need for manual configuration, **improves PageSpeed and Core Web Vitals**, and **boosts SEO** – all while maintaining maximum visual quality across devices. How does it work? ----------------- [](#how-does-it-work) Responsive images that think for themselves: Instead of pre-calculating image sizes server-side, a small fallback image is delivered that analyzes the viewport size and device characteristics (like pixel density) in the frontend. Based on this data, the image sends a request to TYPO3, which calculates the optimal size. The image is then processed and seamlessly replaced with the correct size, ensuring optimal performance and visual quality on the fly. This entire process happens dynamically, without the need for any manual configuration, making it seamless for developers and highly efficient for end users. Usage Examples -------------- [](#usage-examples) Simple image integration in your fluid template. ``` ``` Renderer example ---------------- [](#renderer-example) ``` ``` Installation ------------ [](#installation) ``` composer require zeroseven/pictureino ``` Commands -------- [](#commands) ### Cleanup processed images [](#cleanup-processed-images) Remove all images of dynamic image requests and cleanup the pictureino database entries ``` vendor/bin/typo3 pictureino:cleanup ``` Security -------- [](#security) Pictureiño includes several mechanisms to ensure secure and efficient image processing: - **Rate Limiter**: A built-in rate limiter monitors the number of image requests for new image sizes. This prevents abuse through excessive requests and protects server resources. - **Request Optimization**: Similar image requests are automatically grouped to avoid generating too many images in close proximity. This reduces server load and improves performance. - **Cleanup Task**: Additionally, the processed files are logged along with information about image requests. You can easily delete these images via command, for example, via a regular cron job. These features make Pictureiño a reliable and secure solution for dynamic image generation in production environments. Frequently Asked Questions -------------------------- [](#frequently-asked-questions) ### Does this have any disadvantages for SEO? [](#does-this-have-any-disadvantages-for-seo) No, quite the opposite! Pictureiño improves SEO. By serving WebP images, page load speeds are significantly reduced, which is a key ranking factor for Google. Additionally, with lazy loading, only visible images are loaded, optimizing the initial load time. Pictureiño also ensures that images are always delivered in their optimal size and quality across devices. Plus, structured data is automatically available, even while images are still loading. This helps search engines like Google understand the content and context of images right away, improving indexing. ### Is no configuration necessary at all? [](#is-no-configuration-necessary-at-all) No, the responsive image optimization starts immediately with no setup required. However, you can make manual adjustments if needed, such as defining maximum image sizes or setting breakpoints for different aspect ratios. ### Do I need JavaScript? [](#do-i-need-javascript) Yes, JavaScript is required. The concept is designed so that images dynamically report their optimal size to TYPO3 directly from the frontend. Without JavaScript, this functionality cannot be achieved. ### Can I use this with content blocks? [](#can-i-use-this-with-content-blocks) Yes, you can add the custom TCA field `aspect_ratio` to your content blocks. ``` name: vendor/element typeName: vendor_element group: default prefixFields: true prefixType: vendor fields: # Use the existing field - identifier: aspect_ratio useExistingField: true type: AspectRatio # Add a new field of type AspectRatio - identifier: foo_bar type: AspectRatio ``` ### Health Score 40 — FairBetter than 88% of packages Maintenance50 Moderate activity, may be stable Popularity26 Limited adoption so far Community18 Small or concentrated contributor base Maturity55 Maturing project, gaining track record Bus Factor2 2 contributors hold 50%+ of commits How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~13 days Recently: every ~43 days Total 17 Last Release 181d ago Major Versions v0.12.2 → v1.0.02025-06-02 PHP version history (3 changes)v0.2.0PHP >=8.2 v0.7.0PHP >=8.3 v0.12.1PHP >=8.1 ### Community Maintainers ![](https://www.gravatar.com/avatar/6b22f8a50cfbda138fd9d18f9a9323a9ab93434487122956978e804dee700876?d=identicon)[zerosevendesignstudios](/maintainers/zerosevendesignstudios) ![](https://avatars.githubusercontent.com/u/19648920?v=4)[Raphael Thanner](/maintainers/raphaelthanner)[@raphaelthanner](https://github.com/raphaelthanner) --- Top Contributors [![teneris](https://avatars.githubusercontent.com/u/773723?v=4)](https://github.com/teneris "teneris (15 commits)")[![raphaeludg](https://avatars.githubusercontent.com/u/218826395?v=4)](https://github.com/raphaeludg "raphaeludg (8 commits)")[![srosskopf](https://avatars.githubusercontent.com/u/17512766?v=4)](https://github.com/srosskopf "srosskopf (7 commits)")[![lwinterhalder](https://avatars.githubusercontent.com/u/12656324?v=4)](https://github.com/lwinterhalder "lwinterhalder (5 commits)")[![schliesser](https://avatars.githubusercontent.com/u/11655823?v=4)](https://github.com/schliesser "schliesser (5 commits)")[![raphaelthanner](https://avatars.githubusercontent.com/u/19648920?v=4)](https://github.com/raphaelthanner "raphaelthanner (2 commits)")[![rmue11er](https://avatars.githubusercontent.com/u/6332955?v=4)](https://github.com/rmue11er "rmue11er (1 commits)") --- Tags imagepagespeedpictureresponsive ### Code Quality Static AnalysisPHPStan Code StylePHP CS Fixer Type Coverage Yes ### Embed Badge ![Health badge](/badges/zeroseven-pictureino/health.svg) ``` [![Health](https://phpackages.com/badges/zeroseven-pictureino/health.svg)](https://phpackages.com/packages/zeroseven-pictureino) ``` ### Alternatives [netresearch/rte-ckeditor-image Image support in CKEditor for the TYPO3 ecosystem - by Netresearch 63991.3k4](/packages/netresearch-rte-ckeditor-image)[aimeos/aimeos-typo3 Professional, full-featured and high performance TYPO3 e-commerce extension for online shops and complex B2B projects 1.5k91.2k4](/packages/aimeos-aimeos-typo3)[fluidtypo3/vhs This is a collection of ViewHelpers for performing rendering tasks that are not natively provided by TYPO3's Fluid templating engine. 1954.1M49](/packages/fluidtypo3-vhs)[typo3/testing-framework The TYPO3 testing framework provides base classes for unit, functional and acceptance testing. 675.0M775](/packages/typo3-testing-framework)[leuchtfeuer/secure-downloads "Secure Download": Apply TYPO3 access rights to ALL file assets (PDFs, TGZs or JPGs etc. - configurable) - protect them from direct access. 22234.7k1](/packages/leuchtfeuer-secure-downloads)[eliashaeussler/typo3-form-consent Extension for TYPO3 CMS that adds double opt-in functionality to EXT:form 1481.0k](/packages/eliashaeussler-typo3-form-consent) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)