Lê Vĩnh Thiện

thêm vào lệnh đã có để psql hiểu là dùng " để wrapper string và escape các ký tự đặc biệt như new line

\COPY songs FROM 'data.csv' WITH CSV HEADER DELIMITER ',' QUOTE '"' ESCAPE '\' ;

• C1: Nếu dùng where like thì thêm 1 trường bỏ dấu đi rồi tìm trên trường đó
• C2: Sử dụng fulltext search trong mysql sẽ giải quyết vấn đề dấu, ko dấu, sai chính tả.. cũng như với dữ liệu text lớn thì cũng nhanh hơn. -> recommend
• C3: Thêm một vài framework chuyên cho search
  • dự án nhỏ, siêu nhỏ: meilisearch ...
  • dự án vừa, to: elastic search, solr ...

Có thể dùng nodejs ws để handle kết nối socket ở phía server. dưới đây là ví dụ

// index.js
const {WebSocket} = require('ws');

const socket = new WebSocket(process.env.ENDPOINT, {
  headers: {
    Authorization: `Bearer ${process.env.TOKEN}`
  },
});

socket.on('message', function message(data) {
  // do somethings...
});

// run: $ node index.js

sao ko dùng count($arr) có phải nhanh hơn ko :v

Về cơ bản có thể build đc server proxy nhưng đó sẽ không phải là cách giải quyết vấn đề. Vì rồi nó cũng sẽ ban ip nếu quá những rule mà trang web đặt ra.

Hướng tiếp cận thì phải xem họ cấu hình ntn, ví dụ limit 1 phút đc bao nhiêu request, từ đó điều chỉnh thời gian, lưu lượng request cho hợp lý.

Cách dùng proxy thì có lẽ là lựa chọn cuối cùng, thay vì tự build thì có thể mua proxy qua các dịch vụ sẽ tiết kiệm hơn.

Sau bước nhập thông tin vào ô input đó, bạn xem trang web đó gửi request đến đâu, params, headers, cookie như thế nào(trong tab network). Đây chính là request mà bạn cần nghiên cứu, thay vì tìm cách nhập đc thông tin vào ô input và bấm submit thì tìm cách call request/api mà trang đó đang dùng.

Trong trường hợp bạn vẫn muốn nhập thì có thể dùng các headless browser driver để làm hành động nhập input, click submit.. rồi crawl dữ liệu. Ví dụ như puppeteer, playwright...

vào cái link ở trong phần lỗi kia để xem chi tiết kìa bạn

thêm trường count vào mỗi row để đếm số lượng phần tử con của nó.

id, parent_id, name, count

Khi thêm, sửa xóa con thì update cái count này đệ quy ngược lên từng level cho đến khi parent_id = 0. Chấp nhận thêm/ sửa / xóa sẽ chậm 1 chút nhưng việc xuất tổng số user của 1 node sẽ rất nhanh. Muốn tăng tốc thêm sửa xóa thì có thể cho cái update count này vào background job.

bạn phải cd vào thư mục chứa code của bạn, codeigniter có sẽ có 1 file tên là spark.

spark như kiểu một console app của codeigniter, giống như laravel có artisan. nó giúp chạy những lệnh đã định nghĩa sẵn cho hệ thống như kiểu tạo mới controller, views.. hay start local server

Mình nghĩ bạn ko nên dùng đệ quy ở ngay trong relationship như thế này.

Tốt nhất với hàm showChild thì chỉ nên lấy ra menu ngay dưới cấp của nó.

// trong model
public function child(){
   return $this->hasMany('App\Menu', 'parent_id', 'ID')->select('id', 'parent_id');
}

Tiếp đến viết 1 hàm riêng để lấy tree menu, hàm này dùng đệ quy và thêm điều kiện break vào

// trong model
public function child(){
   return $this->hasMany('App\Menu', 'parent_id', 'ID')->select('id', 'parent_id');
}

// helper
function submenu($menu, $limit = 0) {
  $subMenuColection = collection();
  $subMenu = $menu->child();
  $subMenuColection->merge($subMenu)
  $limit += $subMenu->count();

  if ($limit < 100 && $subMenu->count() > 0) {
    $subMenu->each(function($item, $key) use ($limit) {
      if ($limit < 100) {
        return  $subMenuColection->merge(submenu($item, $limit))
      } else {
       return false;
     }
   })
  }

   return $subMenuColection;
}

// sử dụng trong controller...
$parent = Menu::where('id',1)->first();
$parrent ->submenu()

Tư tưởng là vậy, code trên có thể sai thì sửa thêm tị nha :v mình ko có cái để test

preloadedState là giá trị state mặc định khi đc khởi tạo

https://redux.js.org/api/createstore

Về cơ bản bạn dùng cái nào để làm UI cũng được cả nhưng mỗi component nó sẽ có 1 vài thuộc tính mặc định khác nhau. Tùy vào mục đích để dùng cho nó hợp thôi

Còn tên của các component nói lên ý nghĩa của nó rồi.

Vì việc load data đều xuất phát từ call api nên có thể dùng hooks để tóm gọn code call api gắn với trạng thái loading của lần call api đó

// hooks/useGetData.tsx
import { useEffect, useState } from 'react';
...

const useGetData = (
  endpoint,
  params?,
  successCallback?: () => void,
  failCallback?: () => void,
) => {
  const [loading, setLoading] = useState<boolean>(false);
  const [data, setData] = useState<unknown>();

  useEffect(() => {
    const fetchData = async () => {
      setLoading(true);
        try {
          const response = await axios.get(endpoint, params) // function call api ở đây
          setData(response.data)
          if (successCallback) successCallback(response.data);
        } catch(e) {
          // throw
          if (failCallback) failCallback();
        } .finally{
          setLoading(false);
        }
     }
    fetchData();
  }, [endpoint, params, successCallback, failCallback])
 
  return {
    data,
    loading
  };
}

export default useGetData;

ở trong component nào đó nếu gọi api thì

import useGetData from '@/hooks/useGetData';
...
// trong functional component nào đó
...
const { loading, data } = useGetData('https://api.pornhub.com');

return (<>
{loading ? <LoadingIcon /> : <ListItem items={data}/>}
</>)

có thể tối ưu hơn nữa nhưng đại khái ý tưởng là như vậy :v

với việc chia ra như vầy không chỉ đơn giản việc check loading mà còn có display response/ catch error theo ý muốn. Kiểu như làm 1 cái alert component cho toàn app, fetch data lỗi thì tự hiển thị message mà api trả về... kiểu vậy

P/s: mình viết mã giả thôi nên lỗi cú pháp or import tự fix nhé :v đối số hàm cũng tuỳ chỉnh theo nhu cầu của b

Ko rõ bạn tại sao muốn làm vậy nhưng muốn dùng js thay đổi giá trị input rồi kéo theo kích hoạt onChange của react thi phải làm như sau:

Đại loại là dispatch event click cho cái input đó.

<div id="app">
</div>

<button onclick="clickButton()">Change input state</button>
<script>
function clickButton() {
  const input = document.querySelector('input');
  Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'checked').set.call(input, !input.checked);
  input.dispatchEvent(new Event('click', { bubbles: true}));
}
</script>

Full demo codepen: https://codepen.io/ohmygodvt95/pen/dyWjggw

=> nói chung không nên làm cách này, hãy chỉ dùng react code thôi.

Mình đã comment góp ý một lần rồi, thực sự đọc xong câu hỏi không biết phải trả lời như thế nào. chỉ đành trả lời chung chung vì ko có 1 chút thông tin nào có giá trị.

Câu hỏi của bạn cũng tương tự kiểu: Mình có data làm thể nào để hiển thị lên UI? -> quá chung chung

Không ai trả lời là do bạn đặt câu hỏi không rõ ràng, không biết data của bạn như thế nào, trang của bạn như thế nào, đang dùng theme gì hay đc generate từ plugin nào, tình trạng hiện tại ra sao, bạn muốn render phía nào.... Khi đặt câu hỏi hãy cố gắng clear theo 5W1H

Để đỡ tốn thời gian thì mình clear 1 vài vấn đề như sau:

1. Bạn biết/hiểu về cách hoạt động của wordpress chưa?

2. Bạn đã TỰ tạo dc custom page trong wordpress chưa?

3. Custom page trong wordpress bạn đang dùng đc generate từ đâu, hardcode php hay từ plugin nào?

4. Bạn có thể chỉnh sửa mã nguồn or edit nội dung page đó ko?

1. nếu dữ liệu đã đc lấy về lưu lại thành data ở file or database thì cứ hardcode sửa trang đó thôi

2. nếu dữ liệu đc call từ api thì add js vào call nó rồi dùng js render lại ra view

mình đang thấy đoạn:

if (i === key_cart) {
  arr.push(key_cart)
}

-> tất nhiên chỉ có 1 phần tử thỏa mãn yêu cầu đc add vào trong arr thôi.

Về cơ bản không nên tìm kiếm bằng like như hiện tại.

để tăng tốc tìm kiếm có thể sử dụng một số cách sau:

1. Dùng fulltext search được hỗ trợ sẵn bởi mysql, postgres, đánh index các trường muốn tìm kiếm là đc.

2. Với dữ liệu quá lớn như hàng triệu record, tìm kiếm full nội dung truyện.. thì có thể dùng các công cụ hỗ trợ tìm kiếm riêng biệt để nâng cao hiệu suất cũng như sự chính xác của kết quả.

   2.1 Dữ liệu ít (< 10k row) có thể dùng cloud service với plan free như Algolia Search: https://www.algolia.com/

   2.2 Dữ liệu dưới 10 triệu row có thể dùng MeiliSearch: https://github.com/meilisearch/MeiliSearch, hoặc những app tương đương

   2.3 Dữ liệu nhiều hơn or muốn làm nhiều thứ nâng cao hơn với tìm kiếm có thể dùng Elastic search, tuy nhiên setup, code cũng phức tạp hơn. https://www.elastic.co/

Nói chung tùy vào mục đích và lượng dữ liệu để chọn ra phương pháp để tối ưu search. mình nghĩ với kiểu truyện như dự án của bạn thì dùng full text search đã là đủ rồi, hoặc MeiliSearch cũng đc.

$('.test') // => array

sẽ trả về một mảng các elements có class là test, vì vậy sau đoạn này chỉ cần for thôi :v

var elements = $('.test');
$.each(elements, function(index, value){
  var element= $(value)
  var postId = element.attr('data-id')
  $(value).phanhoi({layid: postId });
})

Như nó đã viết bạn hãy bỏ những js không dùng tới để giảm dung lượng js. Không còn cách nào khác cả.

1. Giảm import không dùng đến

   Ví dụ: 1 thư viện hỗ trợ có 100 function nhưng b chủ sử dụng 1~2 hàm thì hãy chỉ import 1~2 hàm đó vào trong app của bạn. ví dụ dưới đây b sẽ rõ.

import lib from 'sample-lib' 

lib.fncA()...

// != 
import { fncA, funcB } from  'sample-lib' 

fncA()

2. phân chia ra file nhỏ hơn để giảm dung lượng 1 file xuống

   thay vì tải 1 file 5mb thì hãy chia ra có thể là 5 file 1mb chẳng hạn, vì trình duyệt sẽ tải 5 luồng sẽ nhanh hơn.

3. sử dụng cdn để giảm dung lượng file của bạn.

   ví dụ với những thư viện phổ thông kiểu jquery thì nên dùng cdn sẽ tốt hơn.

Ngoài ra đây chỉ mang tính chất tham khảo, đừng quá tin vào nó hay cố gắng để đạt 100đ. Tốn time mà không hiệu quả, tầm 9x điểm là đã okie rồi.