개요 유지보수를 하면서 이전에 작성된 코드를 보는데 `{...props}` 문법이 정말 많이 보였다. 리액트의 문법들에 대해 다 알지 못했기에 무슨 이런 해괴한 문법이 있나... 하면서 찾아보니 꽤나 유용한 문법이었다. 처음 봤을 때는 솔직히 조금 불편했다. 명시적으로 어떤게 있는 지 모르니 말이다... 그러면서 이건 아무래도 안티 패턴인거 같다는 생각이 들었고, 커뮤니티랑 글들을 찾아보니 내 생각이 맞았다. 얼핏 보면 코드도 간결하고, 고수처럼 코딩하는 것 처럼 보인다.// 이렇게 간단하게 props를 넘길 수 있다니!function ParentComponent() { const userProps = { name: '노근', age: 25, job: 'Developer' }; return ;} ..

개요 Flutter뿐만 아니라 프런트엔드 개발을 하다 보면 앱 내부에 이미지를 넣어야 할 때가 있다. 이런 상황에서 일반적으로 두 가지의 포맷을 사용하곤 하는데, 그 두 포맷이 svg와 png다. (jpeg는 투명도가 없기에 사용하지 않는다.) figma를 보고 작업을 하다보면 디자이너가 아이콘들을 svg 포맷으로 주곤 한다. 평소에는 별생각 없이 svg 파일을 받아 사용했는데 문득 의문이 들었다. 'svg를 주로 사용하는 이유가 뭐지?', 'png도 같은 역할을 하는데, 둘의 명확한 차이에 대해 나는 알고 있었나?'. 그래서 개발에서 둘의 차이에 대해 조금 더 깊게 알아보기로 했다. 우선은 간단하게 각각의 특징에 대해 알아보고 성능 상의 차이에 대해 알아보자. 각각의 특징SVG 포맷 SVG는 Sc..