magento2: Theme Development Extremely Slow
Building a new theme within Magento 2 is extremely slow, with page load times exceeding 40 seconds when having to generate theme assets.
Preconditions
- Vagrant Machine
- PHP 7
- Tried Client and Server side compilation of LESS files
- JS and CSS Merge and Minify set to “No”
Steps to reproduce
- Modify LESS File within current theme
- Delete:
../pub/static/frontend/MyPackage/mytheme/en_US/css
../var/view_preprocessed/css',
../var/view_preprocessed/source'
- Reload Desired Page in Browser
- Inspect Network tab
- mydomain.dev loads in approx ~10 seconds
- print.css, styles-l.css, styles-m.css ~40+ seconds
Expected result
- Generation of the page and assets should take less than 10 seconds
Actual result
This makes Magento 2 frontend development painful. While I feel that normally this would be a forum question, the reason it’s a bug is for a few reasons: If there isn’t a better way to do this, the speed is completely unacceptable, and two, if there is a better way to accomplish frontend styling there isn’t documentation indicating otherwise which in itself is a bug.
About this issue
- Original URL
- State: closed
- Created 8 years ago
- Reactions: 7
- Comments: 21 (9 by maintainers)
Im lucky to have already solved that one a number of years back. I use grunt, less and custom theme generation as my custom functionality ontop of Magento 1. The only reason it’s so slow is because of the dependency on PHP that Magento’s build process has. I’d like to see Magento create a webinar or demo of proper front end development from the configuration and theme / project setup side.
And to others comments while I like gulp better at this point. Grunt works awesome, when it’s used with an application respectful of it. @magento. When are you solving this!!!
This is actually a problem I’ve been experiencing as well. I’ve tried each of the available compilation methods, and the one that @duffner described above (deleting the cache files) seems to be the most efficient way to develop.
Yet it becomes incredibly frustrating when every 3-second CSS change requires somewhere in excess of 30 seconds’ worth of waiting.
If you are using a Vagrant and a mounted drive (specially on Windows) I’d recommend to put the Magento inside the virtual machine’s disk space. The communication between Vagrant (guest) and host machine is extremely slow. I had the same issue with Docker. I moved the Magento files inside the container and I upload files from host to guest via PHPStorm sync functionality. The difference in speed is night and day.
@duffner More or less. The guys from Magento explained it better than me.
I think Magento is build for Linux and all other OS (Windows, MacOS) needs to find a way to work around it.
I use a virtual machine with Ubuntu. My Magento files are installed in the VM. Then I only expose the extension/theme files between host and guest machine. I have to keep another copy of Magento on my host machine just so my PHP Storm can work properly though.
@duffner I would recommend you setup nginx, php and mysql using brew. It’s not too difficult to do.
Just install PHP 7.0 and enable opcache in php.ini and your good to go.
I did run into an issue with a max file limit in OS X, but I solved that.
With regards to everybody else on Mac… I’m using a 13" MacBook Pro with an SSD from late 2013. I was thinking of getting a new machine simply because M2 is so slow for development. It’s not so bad when you use grunt etc, but if your changing layouts and html output then it still is quite slow.
Would anyone recommend a 13" or 15" 2016 model? I prefer the portability of the 13" over the 15" but I’m concerned the 13" is only a dual core.
I’m also thinking about getting a Dell XPS 15.
http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/css-topics/css_debug.html
Makes it less painful.