Forem: Bertug Korucu

Executing Shell Commands In Laravel

Bertug Korucu — Wed, 17 Nov 2021 21:45:20 +0000

Both shell_exec() and exec() do the job - until they don't.

If your command crash for some reason, you won't know - shell_exec() and exec() don't throw Exceptions. They just fail silently. 😱

So, here is my solution to encounter this problem:

use Symfony\Component\Process\Process;

class ShellCommand
{
    public static function execute($cmd): string
    {
        $process = Process::fromShellCommandline($cmd);

        $processOutput = '';

        $captureOutput = function ($type, $line) use (&$processOutput) {
            $processOutput .= $line;
        };

        $process->setTimeout(null)
            ->run($captureOutput);

        if ($process->getExitCode()) {
            $exception = new ShellCommandFailedException($cmd . " - " . $processOutput);
            report($exception);

            throw $exception;
        }

        return $processOutput;
    }
}

It utilises Symfony's Process (which comes out of the box to Laravel). ✨

With this way, I can throw a custom exception, log the command and the output to investigate, report it to my logs to investigate, etc.

No more failing silently 😇

Hope you like this little piece! If you do, please give it a ❤️

Bulk Update Multiple Records with Separate Data — Laravel

Bertug Korucu — Sun, 11 Jul 2021 23:45:04 +0000

As a rule of thumb, we should never run database queries inside a for-loop!

“Database transaction” is an expensive operation.

For example, let’s say we designed an inventory software and it’s being used in production for a year, and reached 1,000,000 transactions.

Suddenly, we learnt that we didn’t add the VAT to our transactions. For the transactions in the future, it’s pretty easy to deal with, maybe with a mutator.

class Transaction extends Model { 
    public $vat = 0.20;

    public function setPriceAttribute($value) {
        $this->attributes['price'] += $value * $this->vat;
    }
}

Future records are pretty easy to deal with. However how are we going to edit the 1 million records from the past.

For editing data from the past, I prefer to create a Seeder.

php artisan make:seeder AddVatToTransactions

How not to do it?

class AddVatToTransactions extends Seeder {

  public function run() 
  {
    $vat = 0.20;
    $transactions = Transaction::get();

    foreach ($transactions as $transaction) {
       $transaction->price += $transaction->price * $vat
       $transaction->save();
    }
  }
}

However, running it in a loop of 1 million and making a “database transaction” in each iteration of the loop — not a good idea! (Spoiler Alert: It’ll freeze your system 😀)

Then, how to do it?

Again, in our AddVatToTransactions Seeder:

The idea in mysql query is “CASE Statements”

UPDATE db.transactions
SET PRICE = CASE  
              WHEN id = 3 THEN 500
              WHEN id = 4 THEN 300
           END 
WHERE ID IN (3, 4)

Now, let’s do it in Laravel:

$vat = 0.20;
$transactions = Transaction::get();

$cases = [];
$ids = [];
$params = [];

foreach ($transactions as $transaction) {
    $cases[] = "WHEN {$transaction->id} then ?";
    $params[] = $transaction->profit * $vat;
    $ids[] = $transaction->id;
}

$ids = implode(',', $ids);
$cases = implode(' ', $cases);

if (!empty($ids)) {
    \DB::update("UPDATE transactions SET `price` = CASE `id` {$cases} END WHERE `id` in ({$ids})", $params);
}

This will make one database transaction to write it all your updates.⚡️

🗣 I can hear some of you saying: “It’s still FREEZING”

So.. Optimizing it even further:

#1: “Select” only the data you need from the database to consume less RAM.

In our example, we only use “id” and “price” columns. So let’s only select them.

$transactions = Transaction::select('id', 'price')->get();

#2: “Chunk” your collection to separate your transaction to multiple database transactions.

In Laravel, you can chunk collections like

Transaction::get()->chunk(5000);

Let’s apply all in our example

Here, first we divide our $transactions collection into 5000 chunks and we do a “database transaction” per 5k records at once.

$vat = 0.20;
$transactions = Transaction::get();

foreach ($transactions->chunk(5000) as $chunk) {
   $cases = [];
   $ids = [];
   $params = [];

   foreach ($chunk as $transaction) {
       $cases[] = "WHEN {$transaction->id} then ?";
       $params[] = $transaction->profit * $vat;
       $ids[] = $transaction->id;
   }

   $ids = implode(',', $ids);
   $cases = implode(' ', $cases);

   if (!empty($ids)) {
       \DB::update("UPDATE transactions SET `price` = CASE `id` {$cases} END WHERE `id` in ({$ids})", $params);
   }
}

Hope you like this trick!

Please let me know what you think in the comments 💬

Happy coding! 😊

Using Vite with Inertia — Laravel, Vue & Tailwind

Bertug Korucu — Sun, 11 Jul 2021 23:24:57 +0000

TLDR; 5800ms (Laravel Mix) to 224ms (Vite⚡️) on hot-reload!

We’ve been using Laravel-Mix for years and it’s been doing pretty good. However, recently we decided to build a project using Inertia.js (which was an awesome decision).

As the project started to grow, the development became a pain to wait for the webpack compiling.

Then, we decided to give Vite (from Vue’s creator Evan You) and the results were… ASTONISHING! I’ve been seeing Vite around in Twitter, but to be honest with you, I was not expecting THIS MUCH OF SPEED! 🚀

Laravel-Mix was getting too so slow. 🐢

Benchmark Test on Hot Reloading (with 16" MBP 64gb ram, 2.4 GHz 8-Core Intel Core i9)

|    Compilation     | Laravel Mix | Vite  |
|--------------------|-------------|-------|
| Initial Compile    | 13257ms     | 636ms |
| Change Reflection  | 5848ms      | 224ms |

That’s like ‘20x for initial compilation’ and ‘25x when code change’ 😲

We are fascinated by results, so let me tell you how to set it up, so you can try it out too.

Migrating To Vite⚡️

First, you’ll need to install Vite:

npm install vite

Then, install Tailwind

npm i tailwindcss postcss autoprefixer -D

Create “vite.config.js” and “postcss.config.js” in your project base

const { resolve } = require('path');
import vue from '@vitejs/plugin-vue';

export default ({ command }) => ({
  base: command === 'serve' ? '' : '/dist/',
  publicDir: 'fake_dir_so_nothing_gets_copied',
  build: {
    manifest: true,
    outDir: resolve(__dirname, 'public/dist'),
    rollupOptions: {
      input: 'resources/js/app.js',
    },
  },

  plugins: [vue()],

  resolve: {
    alias: {
      '@': resolve('./resources/js'),
    },
  },
});

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  }, 
}

For the sake of completeness, here is Tailwind config (JIT is amazing as well!)

module.exports = {
  mode: "jit",
  purge: ['./resources/**/*.{js,jsx,ts,tsx,vue,blade.php}'],
  theme: {},
  variants: {},
  plugins: [],
}

And finally, you need to configure your app.js for Vite to work with Inertia.js. (The production compiling part kept me in the dark for a few hours)

import 'vite/dynamic-import-polyfill';
import '../css/app.css';
import { createApp, h } from 'vue'
import { App, plugin } from '@inertiajs/inertia-vue3'

let asyncViews = () => {
  return import.meta.glob('./Pages/**/*.vue');
}

const app = createApp({
  render: () => h(App, {
    initialPage: JSON.parse(el.dataset.page),
        resolveComponent: async name => {
            if (import.meta.env.DEV) {
                return (await import(`./Pages/${name}.vue`)).default;
            } else {
                let pages = asyncViews();
                const importPage = pages[`./Pages/${name}.vue`];
                return importPage().then(module => module.default);
            }
        }
    })
})

Few things to keep in mind are:

You can’t use require("file") syntax, so you always need to use import * from file.js
You need to specify file extensions when importing Vue components, like import FormInput from "@/Shared/Form/FormInput.vue"
"app.js" is the only point of entry for your app, so you need to import your app.css file in your app.js.

…and your front-end is ready 🎉

Setting up Laravel and package.json scripts

I wanted to run “hot reloading” as well as “production” environment interchangeably in my local, so I came up with the below solution. (If you figure out a better way, I’d be happy to hear)

Vite in 'dev mode' creates a local server in https://localhost:3000 (which can be configured in vite.config.js) whereas in ‘production mode’, it creates files in 'public/dist'.

Edit your ‘package.json’ file accordingly:

"scripts": {
    "predev": "printf \"dev\" > public/hot",
    "dev": "vite",
    "preprod": "printf \"prod\" > public/hot",
    "prod": "vite build"
},

npm run vite is hot reloading itself and npm run dev is just for alias. The “pre” hooks are used to create a file in public directory so that the backend can figure out which mode is running.

Finally, you need to create a helper to resolve the path in your blade
— just like Laravel Mix’s {{ mix('/js/app.js') }} helper.

You can create this php file in 'app/Helpers/vite.php' (or anywhere you like)

<?php

use Illuminate\Support\HtmlString;

if (! function_exists('vite_assets')) {
    /**
     * @return HtmlString
     * @throws Exception
     */
    function vite_assets(): HtmlString
    {
        $devServerIsRunning = false;

        if (app()->environment('local')) {
            try {
                $devServerIsRunning = file_get_contents(public_path('hot')) == 'dev';
            } catch (Exception) {}
        }

        if ($devServerIsRunning) {
            return new HtmlString(<<<HTML
            <script type="module" src="http://localhost:3000/@vite/client"></script>
            <script type="module" src="http://localhost:3000/resources/js/app.js"></script>
        HTML);
        }
        $manifest = json_decode(file_get_contents(
            public_path('dist/manifest.json')
        ), true);
        return new HtmlString(<<<HTML
        <script type="module" src="/dist/{$manifest['resources/js/app.js']['file']}"></script>
        <link rel="stylesheet" href="/dist/{$manifest['resources/js/app.js']['css'][0]}">
    HTML);
    }
}

And include it to your composer.json

"autoload": {
    "psr-4": {...},
    "files": [
        "app/Helpers/vite.php"
    ]
},

[make sure to run:composer dump-autoload]

And finally add it to your master.blade.php

<!DOCTYPE html>
<html>
<head>
    <!-- Stuff -->
    {{ vite_assets() }}
    <!-- More Stuff -->
</head>

🏁 You are all set. Enjoy the super-speed compiling times ⚡️

I believe this will change your development experience as drastic as it did to me! 🚀

I’m really curious about your compiling speeds, please leave a comment. 💬