Magento 2 – Performance Optimization

Here we are going to discuss about two things: Server Response and Browser Rendering

Server Response: Increasing server response time is little difficult as we need to audit and optimize php code and server configurations. We will talk about this latter.

Browser Rendering: Browser rendering optimization is quite easy which involves images optimizing, compressing and css/js/html minify, defer javascript loading, etc. The best tool we can use for analysis is Google PageSpeed Insights <https://developers.google.com/speed/pagespeed/insights/>, which will give you full report along with score and suggestion (if you have public URL). In other case we can use chrome extension named YSlow (recommended as this is useful for debugging on localhost).

Magento 2 – Different mode switching

Display the current mode
php bin\magento deploy:mode:show

Change to production mode
php bin\magento deploy:mode:set production

Changing from production mode to developer mode
> delete the contents of the var/generation and var/di directories: rm -rf <your Magento install dir>/var/di/* <your Magento install dir>/var/generation/*
> php bin\magento deploy:mode:set developer

Whenever you switch to developer or production mode, Magento automatically clear the contents of following directories:
var/cache
var/di
var/generation
var/view_preprocessed
pub/static

Exceptions:
.htaccess files are not removed
pub/static contains a file that specifies the version of static content (deployed_version); this file is not removed

Magento 2 – Install extension using command line

There are several ways of installing Magento 2 extension. Popular ways are using command line, composer and manual install. But install via command line recommended.

Here are steps to be followed using command line.

Step 1: Download and unzip the file in a temporary location
Step 2: Upload it to your Magento 2 root directory
Step 3: Open up the terminal or command line
Step 4: Run below 3 command one-by-one

php -f bin/magento module:enable -c Namespace_Modulename
php -f bin/magento setup:upgrade
php -f bin/magento cache:clean

Step 5: Verify your newly install extension at Stores >> Configuration >> Advanced >> Advanced
Step 6: Enjoy

Magento 2 – Move top links in footer and navigation

Tested for Luma theme (block name: header.links)

Suggested: Go through below file for Luma theme header block information:-

vendor/magento/theme-frontend-luma/Magento_Theme/layout/default.xml
<block class=”Magento\Framework\View\Element\Html\Links” name=”top.links”>

<arguments>

<argument name=”css_class” xsi:type=”string”>header links</argument>

</arguments>

</block>

Magento 2 – Add new CMS top links

For blank theme

<referenceBlock name=”top.links”>

<!– Contact us Link –>

<block class=”Magento\Framework\View\Element\Html\Link” name=”contactus.link” after=”register-link”>

<arguments>

<argument name=”label” xsi:type=”string” translate=”false”>Constact Us</argument>

<argument name=”path” xsi:type=”string” translate=”false”>contact-us</argument>

</arguments>

</block>

Magento 2 – Remove top links

<referenceBlock name=”register-link” remove=”true” />           <!–for Create Account Link–>

<referenceBlock name=”register-link” remove=”true” />           <!–for Create Account Link–>

<referenceBlock name=”authorization-link” remove=”true” />      <!–for Sign In Link  –>

<referenceBlock name=”wish-list-link” remove=”true” />          <!–for WishList Link–>

<referenceBlock name=”my-account-link” remove=”true” />         <!–for My Account Link–>