Refactoring & Design Pattern

Pernah kamu mendengar kata refactor? Tentunya pernah! Namun, apakah sebenarnya makna dari kata tersebut?

Refactoring

…is a disciplined technique for restructuring an existing body of code, altering its internal structure without changing its external behavior.

Its heart is a series of small behavior preserving transformations. Each transformation (called a “refactoring”) does little, but a sequence of transformations can produce a significant restructuring. Since each refactoring is small, it’s less likely to go wrong. The system is kept fully working after each small refactoring, reducing the chances that a system can get seriously broken during the restructuring.

Kalimat di atas dikutip dari buku Refactoring karya Martin Fowler.

Code Refactoring merupakan suatu proses untuk melakukan klarifikasi atau simplifikasi desain dari code yang telah dibuat sebelumnya tanpa mengubah behavior dari code tersebut. Hal ini sangat penting, terutama dalam metodologi agile. Kenapa ya?

Saat mengembangkan aplikasi dengan agile, anggota tim tentunya akan melakukan maintaining ataupun mengembangkan code-nya dari iterasi satu ke iterasi selanjutnya. Hal tersebut mengakibatkan banyak sekali transformasi yang terjadi pada code. Oleh karena itu, refactoring merupakan salah satu cara yang mudah untuk mencegah terjadinya hal-hal yang tidak diinginkan pada software.

Secara umum, refactoring dilakukan dengan tujuan untuk mencegah kerusakan pada code (code rot). Setiap kali terjadi perubahan pada code tanpa refactor tentunya akan menyebabkan code rot semakin besar dan menyebar. Sehingga refactor dapat digunakan untuk menjaga agar code mudah di maintain. Nah, biasanya refactor dilakukan dengan metode Test-First. Sehingga, jika Kamu sudah terbiasa dengan TDD, tentunya kamu akan terbiasa juga dengan refactoring yang merupakan bagian dari hal tersebut.

Refactoring juga tidak hanya dilakukan pada level low code. Menurut Joshua Kerievsky pada bukunya yang berjudul Refactoring to Patterns, refactoring merupakan sebuah teknik yang erat kaitannya dengan design pattern. Wah, apaan tuh design pattern?

Design Pattern

Dalam hal software engineering, design pattern merupakan sebuah solusi yang dapat digunakan secara berulang untuk suatu permasalahan yang umum. Dengan kata lain, design pattern merupakan blueprint yang dapat di-customized untuk memecahkan suatu masalah pada code.

Terdapat beberapa jenis dari design pattern. Kira-kira apa saja ya?

Creational Design Pattern

Design pattern ini berkaitan erat dengan class instantiation. Selanjutnya dapat dibagi menjadi class-creation pattern dan object-creational pattern. Pattern ini pun memiliki beberapa jenis, yaitu:

1. Abstract Factory: membuat instance dari class yang saling berhubungan
2. Builder: Memisahkan construction object dari code representasinya
3. Factory Method: membuat instance dari beberapa class turunan
4. Object Pool: recycling object yang tidak digunakan
5. Method: fully-initialized instance yang dapat dicopy atau cloned
6. Singleton: class yang hanya memiliki single instance

Structural Design Pattern

Design pattern ini merupakan pattern yang berkaian dengan komposisi class dan object. Biasanya dilakukan dengan menggunakan inheritance. Adapun jenis-jenis yang dikategorikan dalam pattern ini antara lain:

1. Adapter: menghubungkan interface dengan class-class yang berbeda
2. Bridge: memisahkan interface dari object dari implementasinya
3. Composite: berupa tree structure yang sederhana
4. Decorator: menambahkan responsibilities secara dinamis pada suatu object
5. Facade: sebuah class yang merepresentasikan keseluruhan subsystem
6. Flyweight: digunakan untuk tujuan efisiensi
7. Private Class Data: menjaga akses untuk accessor/mutator
8. Proxy: sebuah object yang merepresentasikan object lainnya

Behavioral Design Pattern

Berbeda dengan sebelumnya, kategori pattern ini berkaitan dengan komunikasi antar object. Jenis-jenisnya adalah sebagai berikut:

1. Chain of Responsibility: sebuah cara untuk menyampaikan request secara berantai.
2. Command: enkapsulasi command request sebagai suatu object
3. Interpreter: cara untuk memasukkan ‘language element’ pada program.
4. Iterator: melakukan akses pada koleksi elemen secara sequential
5. Mediator: berperan sebagai mediator yang mendefinisikan komunikasi antar kelas agar lebih sederhana.
6. Memento: capture and resture an object’s internal state
7. Null Object: di-desain agar memiliki peran sebagai default value dari suatu object
8. Observer: Memberikan notifikasi pada kelas-kelas tertentu apabila ada perubahan
9. State: mengubah behavior dari suatu object ketika statenya berubah
10. Strategy: enkapsulasi algoritma di dalam class
11. Template Method: membuat template algoritma untuk digunakan pada subclass
12. Visitor: mendefinisikan operasi tertentu pada kelas tanpa mengubah apapun.

Implementasi pada Project

Karena menggunakan framework ReactJS tentunya kita dapat menggunakan design pattern pada pengembangan software. Pada project Dekowarehouse, salah satu design pattern yang digunakan adalah Decorator Design Pattern.

Hmm, maksudnya bagaimana ya?

Jadi, component yang dibuat dibungkus dengan menambahkan fungsi tertentu atau props pada component tersebut. Contohnya:

class Detail extends Component { 
    render() {
      return (
        <BrowserRouter>
          <Header/>
          <Slider id={this.props.id}/> 
          <Footer/>
        </BrowserRouter>
      )
    }
  };

export default Detail; 

Nah, terlihat kan bahwa terdapat component slider yang dibungkus untuk menjalankan sebuah fungsi. Component tersebut juga menggunakan props agar dapat dijalankan.

Sebenarnya, pada ReactJS sudah terdapat desain pattern tertentu yang dapat digunakan. Begitu juga dengan framework lainnya. Selengkapnya, bisa kamu baca di sini.

Okay, selamat belajar teman-teman!