Leaderboard

ProcessWire and photo-heavy sites go hand-in-hand. But these sites can also present development challenges, especially when cloning a large site. This post goes into detail about techniques you can use to keep lightweight development sites without all the photo/image overhead. https://processwire.com/blog/posts/developing-photo-heavy-sites/

Hi everyone, I’m excited to share a new module I’ve been working on: GrokImagine. It integrates the x.ai (Grok) API directly into the admin interface, allowing you to generate AI images on the fly for your Pageimage fields. Instead of leaving the CMS to generate assets, you can now do it right where you need them. Key Features: Progressive Loading: Unlike many AI modules that make you wait for the whole batch, this one loads images one-by-one as soon as they are ready. Batch & Variety: Generate up to 4 variations. The module intelligently tweaks prompts for batch requests to ensure you get different angles and compositions rather than duplicates. Aspect Ratio Control: Built-in selector for 16:9, 1:1, 9:16, and 4:3. Model/Resolution Settings: Support for both grok-imagine-image-pro and standard models, plus 1k/2k resolution toggles. Seamless Integration: Enable it only for specific image fields via the module settings. How it works: Enter your API Key from console.x.ai in the module config. Go to any page with an enabled image field. Type a prompt, hit "Generate," and watch the "skeletons" fill up with images. Click the ones you like (blue checkmark) and save the page—the module handles the WireHttp download and adds them to your field automatically. GitHub Repository: https://github.com/mxmsmnv/GrokImagine Installation: Download or clone into /site/modules/GrokImagine. Install via the Admin Modules dashboard. I’d love to hear your feedback or any suggestions for future features! 🍀

Given RepeaterMatrix is based on Repeater there are no differences performance wise. Actually I did it exactly this way for a project before I purchased ProFields so there’s nothing wrong with that. It’s (mostly) about convenience.

Worked on this the last couple days: https://github.com/elabx/processwire-mcp just tested it yesterday, so not a lot of usage.

Try to reference the ID instead: section_type=6|7

Screenshots:

Incidentally, when you mention you reached limits of performance, where and how did those limits manifest? I ran your query / issue through my AI Agent and had the following response. The Real Diagnosis Your friend likely experienced real slowness, but the cause is almost certainly inefficient query patterns (loading too many pages at once, N+1 queries, unindexed searches) rather than a fundamental limitation of pages-as-assets. These are the same problems any ORM-based system hits at scale, and they have well-known solutions. What MediaHub Would Need for 100K Assets Problem Fix Effort Crops filter loads all crop pages Direct SQL: SELECT DISTINCT master_id Small N+1 crop count per listing Batch query or denormalized count field Small LIKE search on title/desc Add FULLTEXT indexes Small Tag dropdown loads all tags Already paginated or use autocomplete Small No query caching Add WireCache for expensive queries Medium Standard pagination at scale PW handles this natively with start= + limit= Already done Streaming large exports Use $pages->findMany() (lazy loading) Small None of these require rethinking the data model. They're standard database optimization work. Summary The page-per-asset architecture is sound and scalable. ProcessWire's page model with proper indexing handles 100K+ pages without issue. The current MediaHub implementation has a handful of query patterns that would need optimization (mostly the crop filter and N+1 counts), but these are straightforward fixes. Switching to a JSON-in-field approach would solve the wrong problem while creating a bespoke data layer that loses most of PW's value and introduces its own harder-to-fix scaling issues. //END What do you think of above

Thanks @virtualgadjo. The contentTypes tip looks interesting, though I'm not yet advanced enough yet to fully understand it, but I'll get there eventually! 😄 Ah yes @psy, I forgot about the <region> tags - good idea. I was just going to try something like <script pw-id='js' ...... pw-optional></script> but I'm not sure if that would work with prepending, before, after, etc and if the tags don't match. The region approach looks cleaner. Thanks!

I though you were talking about THIS, now I just furiously started prompting all the bugs meanwhile I go reviewing and doing stuff on my own. Now just boostrapping ddev somwhere (gihub codespaces?) , some E2E testing, feedback loop till acceptance and out of work lol

Sure, just visit cursor.com on a mobile device and log in. Look for the Agents link in top right. Select your project and branch if you’re connected to Git Then if you’re out, at the gym or on anywhere away from desk I just dictate the features I want and let the cloud agents run.

So many ways to create great websites. I use Markup Regions too. In _main.php I have regions: // in <head> <region id="regHeadCSS"> </region> // just above the closing </body> tag <region id="regFooterScripts"> </region> then on a per template basis I can "pw-append" any CSS or JS specific to an individual template. If no extra CSS or JS needed, no problem.

Hi @ai_slop if you knew how much i agree with this, of course my very first website with pw was made with my usual includes of header and footer php files but as soon as i decided to try and understand the various output strategies and tried the markup regions it was a no return back path 😀 what you describe about your homepage is somthing i often run into too, my solution varies from the things i need for the hom page, sometimes i can even be e script tag with various things far easier to deal with in the template and that would be a bit too much in the website general js file in this case i use the trick i spoke about, my script tag surrounded by a simple if page id is 1 but when i'm a little less lazy i sometimes even use something pw allows me to do, when i need ereally specific heavy css for example based on some pages parent, ids or even a variable value, i add the type i need to the config, i.e $config->contentTypes = array_merge($config->contentTypes, array( 'css' => 'text/css' ) ); this way you'll have a new header type added to the Content-type combo box choice in the template and a php file with a css type header but having access to pw api, this allows you some pretty acrobatic things 🙂 but well, to be honest, i more often use the old php if to load some files or even output script tags keeping in mind that the _main.php file is appended at the end of the template files, you can also submit content, script, files and so on output or not, relying on a var you define in the template itself, actually, the kind of things you could do even in a not pw structure but taking advantage of pw api have a nice day

It looks fantastic so far. Great work. 😯 I'm currently struggling with similar problems and requirements for a media manager. However, it needs to be scalable enough to easily handle 100,000 assets (for a news portal). My experiments with the principle that each asset is also its own page quickly reached the limits of performance. I am therefore pursuing the approach of storing the actual asset paths in the database, i.e. as a JSON object in a separate input field. A well-known problem: what happens if you rename the asset in the file system? I am still in the testing phase to see if this can be solved with a simple SQL replace and update. However, I would be very happy to test your module. Maybe I don't have to reinvent the wheel after all. 🙂 Here are a few more wishes that I have as requirements in my projects: Folders: Customers love folders and folder trees. Multiple use: An asset is used multiple times on different pages; it must also be possible to have different descriptions here. With the MM module, for example, the description is global and cannot be changed individually for each reference. Language versions: An asset is only available for certain language versions, so it can be deactivated for EN, for example, and will not be displayed in this language in the frontend. Automatic categorisation: An API that enables automatic categorisation after uploading/saving. Example: In the ‘News’ template, there is a select field called ‘Category’. If a new image is uploaded in the edit mode of the page, it should be automatically loaded into the folder of the selected category or alternatively tagged. In the best case, this creates an automatic structure if you can define several fields such as ‘News/2026/Category’. The date is read from a date field and the category from a select field, etc.

Export your ProcessWire site structure as comprehensive, AI-optimized documentation for ChatGPT, Claude, Copilot, and other AI coding assistants. What It Does Context automatically generates complete documentation of your ProcessWire site in formats specifically optimized for working with AI: 📊 Site Structure Complete page hierarchy exported as JSON, TOON, and ASCII tree Shows all relationships, templates, URLs, and metadata Smart collapsing for large page lists 📋 Templates & Fields All template definitions with complete field configurations Field types, options, requirements, default values Special handling for Repeater, Matrix, Table fields 📦 Content Samples Real page examples exported for each template Shows actual data formats and field usage Helps AI understand your content patterns 💾 Code Snippets Customized selector patterns for your site type Helper functions and utility code API implementation examples 🤖 AI Prompts Ready-to-use project context file Template creation prompts Debugging assistance prompts Dual Format Export (The Game Changer!) Context exports in two formats simultaneously: JSON Format Standard format for development tools, APIs, and compatibility TOON Format (AI-Optimized) ✨ Token-Oriented Object Notation designed specifically for AI prompts: 30-60% fewer tokens than JSON Significantly reduces API costs Same data, more compact representation No external dependencies - pure PHP Real Savings Example For a typical ProcessWire site with 50 templates: structure.json (15,000 tokens) → structure.toon (8,500 tokens) = 43% savings templates.json (8,000 tokens) → templates.toon (4,000 tokens) = 50% savings samples/*.json (12,000 tokens) → samples/*.toon (6,500 tokens) = 46% savings Cost Impact (Claude Sonnet pricing): JSON export: $0.105 per AI interaction TOON export: $0.057 per AI interaction Save ~$5/month if you use AI assistants 100 times/month Installation cd /site/modules/ git clone https://github.com/mxmsmnv/Context.git Then in admin: Modules → Refresh → Install Or download from ProcessWire Modules Directory Quick Start Setup → Modules → Context → Configure Choose your site type (Blog, E-commerce, Business, Catalog, Generic) ✅ Enable "Export TOON Format" (recommended for AI work!) Enable optional features: ✅ Export Content Samples ✅ Create Code Snippets ✅ Create AI Prompts Click "Export Context for AI" Files appear in /site/assets/context/ Generated Files /site/assets/context/ ├── README.md # Complete documentation ├── structure.json / .toon # Page hierarchy ├── structure.txt # ASCII tree ├── templates.json / .toon # All templates & fields ├── config.json / .toon # Site configuration ├── modules.json / .toon # Installed modules ├── classes.json / .toon # Custom Page classes │ ├── samples/ # Real content examples │ ├── product-samples.json │ └── product-samples.toon # 46% smaller! │ ├── snippets/ # Code patterns │ ├── selectors.php # Customized for your site type │ ├── helpers.php # Utility functions │ └── api-examples.php # REST API examples │ └── prompts/ # AI instructions └── project-context.md # Complete project overview Using with AI Assistants Upload TOON files to save tokens and costs: 📎 structure.toon 📎 templates.toon 📎 prompts/project-context.md Then ask your AI assistant: "Help me create a blog post template with title, body, author, categories, and featured image. Follow the existing patterns from templates.toon" The AI has complete context of your site and can generate code that follows your exact patterns! Site Type Customization Code snippets automatically adapt to your site type: Blog / News / Magazine Post listings, author archives, category filtering Recent posts, popular content, related articles E-commerce / Online Store Product listings, cart logic, order processing Inventory management, payment integration Business / Portfolio / Agency Service pages, team members, case studies Testimonials, project galleries Catalog / Directory / Listings Brand hierarchies, category filters Advanced search, sorting, pagination Generic / Mixed Content General purpose patterns for any site type Features Overview Always Exported (Core) ✅ Complete page tree structure ✅ All templates with field definitions ✅ Site configuration and settings ✅ Installed modules list ✅ Custom Page classes ✅ README with complete documentation Optional (Configurable) ⚙️ Content samples (1-10 per template) ⚙️ API JSON schemas ⚙️ URL routing structure ⚙️ Performance metrics ⚙️ Code snippets library ⚙️ AI prompt templates ⚙️ IDE integration files (.cursorrules, .claudecode.json) Advanced Settings Auto-update on template/field changes Maximum tree depth (3-20 levels) JSON children limit (prevent huge files) Compact mode for large lists Custom AI instructions Why TOON Format? TOON is specifically designed for AI prompts. Here's the difference: JSON (verbose): { "products": [ {"id": 1, "title": "Dark Chocolate", "price": 12.99}, {"id": 2, "title": "Milk Chocolate", "price": 9.99} ] } TOON (compact): products[2]{id,title,price}: 1,Dark Chocolate,12.99 2,Milk Chocolate,9.99 Same data, 50% fewer tokens! Use Cases 🤖 AI-Assisted Development Upload your site context to Claude/ChatGPT and get code that follows your exact patterns 📚 Developer Onboarding New team members get complete site documentation instantly 🔄 Site Migration Export complete site structure for documentation or migration planning 📖 Code Standards Maintain consistency across your team with AI that knows your patterns 💰 Cost Optimization Reduce AI API costs by 30-60% with TOON format Links GitHub: https://github.com/mxmsmnv/Context TOON Format Spec: https://toonformat.dev Screenshots Example Workflow Export your site Click one button, get complete documentation in both JSON and TOON formats Upload to AI Upload .toon files to Claude/ChatGPT for maximum efficiency Build features faster AI knows your exact site structure, templates, and patterns Save money Use 30-60% fewer tokens on every AI interaction Perfect for ProcessWire developers who use AI coding assistants! The TOON format support makes it significantly more cost-effective to work with Claude, ChatGPT, and similar tools. Questions? Suggestions? Let me know! 🚀