useEffect 사용시 렌더링 순서

그럼 useEffect 안의 함수를 실행시키고 재렌더링을 해서 html을 읽고 싶으면 
setTimeOut이나 eventListener 같은 함수를 써야 되는건가요?

지금 게시판을 만들고 있는데 useEffect 안에 정보요청하는 함수를 만들어서  state 안에 담고 다시 setTimeout 함수를 써서 html을
읽게하는 방식으로 코드를 짯는데 비효율적인 방식인가요?
지금 저의 방식으로 가져온 데이터를 보여주려면 데이터를 저장하고 다시 html을 읽어야 정보를 보여줄 수 있다고 생각했습니다!
(보통 api 호출하는 함수는 시간이 오래 걸려서 useEffect 안에 넣는다고 알고 있습니다!)

 let category_path = localStorage.getItem('pathBoardTitle')
    let [data, setData] = useState([]);

    useEffect(() => {
        console.log(category_path)
        axios.get(`/api/v1/posts/${category_path}`, {
            headers: {Authorization : props.cookies.token}
          })
          .then((res)=>{
            setTimeout(()=>{setData(res.data)}, 100);
          })
          .catch((res) => {
            console.log(res)
          })
    },[])

아 useEffect 내의 함수가 실행되고 setTimeout 같은 함수를 안써줘도 알아서 html이 실행되는거같네요.
감사합니다!