개발 170 [플러터] 비디오 랜더링 이슈 수정기(video-player,dispose) 들어가며 이번 글에서는 플러터에서 20개의 비디오를 재생하면서 발생한 오류를 추적하여 개선을 한 경험에 대한 글입니다. 플러터의 video player부터 사용하는 패키지의 디테일한 설정 및 사용법을 다루진 않습니다. 대략적인 사용법과 이런 점이 문제여서 이렇게 바꿨다의 수준으로만 설명합니다. 에러부터 살펴보자 웹이나 앱 개발자들은 서버개발자와 달리 에러를 추적하기기 쉽지 않습니다. 또한 에러 발생한 것은 알아도 유저의 디바이스나 여러 외부환경에 의해서 달라질 수 있는 만큼 외부 에러추적 서비스를 이용하는 경우가 많은데요. 제가 만들어놓은 앱도 Sentry를 사용하고 있었습니다. 그런중에 어느 순간 반복적으로 특정 에러가 대한 리포트가 오기 시작하고, 실제 유저의 QA문의가 들어와서 해당 이슈를 파헤쳐보.. 2023. 9. 24. [개발회고] 23년 8월 회고 개발 이번 달은 클린아키텍쳐와 디자인시스템에 대한 고민이 많았던 달이다. 온라인 에디터를 개발하고 있는 상황에서, 점점 복잡해지는 로직, 많이지는 요구사항 생각거리가 한두가지가 아니다. 이럴때 딴딴한 테스트코드와 더 좋은 아키텍쳐가 있으면 어땠을까라는 아쉬움이 많이 드는 달이었다. 조만간 새로운 프로젝트에 들어가는데 이때는 시작부터 빡세게 아키텍쳐를 고민하고 개발해야할듯하다. 이러한 고민을 팀장님께 말씀드렸더니, "그동안 하고 싶은 말이 많았는데, 직접 경험하기 전까지 내가 하는 소리는 잔소리라고 생각할까봐 가만히 뒀어" "개발자는 경험해봐야해, 안타깝지만 꼭 피를 봐야 다음부터 예방하는 족속이지" 이미 피를 본 이상 예방책을 빡세게 세우는 개발자가 될 수 밖에 없는듯하다. 몇달만에 가졌던 여유있는 커피.. 2023. 9. 6. [Web worker] 웹워커 간단 사용기 들어가며 이번 글은 web worker(이하 웹 워커)에서 postMessage에 대한 에러를 확인하고 이를 수정하는 방법론? 에 대한 글입니다. 이 글에선 웹 워커의 간단한 동작,worker와의 통신, react에서 사용할 때 주의해야 할 점을 다룹니다. Web worker란 web.dev 문서를 잡고하면 웹 워커는 웹 애플리케이션에서 백그라운드 스크립트를 생성하기 위한 API입니다. 이 말보다는 저는 웹 워커는 자바스크립트에 없는 동시성을 주는 브라우저의 기능이다라고 설명합니다. 자바스크립트의 한계 웹 워커는 자바스크립트의 언어 자체가 가진 문제점으로 인해 만들어졌습니다. 자바스크립트는 단일 스레드 환경으로 여러 가지 스크립트를 동시에 실행할 수 없습니다. 그래서 비동기 코드를 작성하거나 setTim.. 2023. 9. 4. [Audio] 오디오를 눈으로 보는 2가지 방법(peaks와 wavesurfer) 들어가며 이번 글에서는 오디오를 그리는 방법에 대해 알아보고 간단한 구현 방법을 설명합니다. 그다음으로는 라이브러리 Wavesurfer에 대해 간단히 소개하고 알아보도록 하겠습니다. 다루는 내용은 아래와 같습니다. 오디오를 그리는 방법 Wavesurfer를 다루는 방법 v6 -> v7로 바뀌면서 달라진 점 오디오를 그리는 방법 일단 오디오를 다루는 회사에서 근무하고 있는 저에게 오디오를 그리는 기능은 필연적이었습니다. 그래서 처음에는 직접 waveform를 그렸습니다. 그리는 방법은 생각보다 간단한데요. 직접 구현하기 직접 구현하는 방법은 Canvas를 이용하는 방법입니다. ( 다른 라이브러리도 같습니다만) 데이터 가져오기 로컬에 있는 파일이던 서버에 있는 파일이던 일단 데이터를 가져오는 것부터 시작합니.. 2023. 8. 13. 이전 1 2 3 4 5 6 7 ··· 43 다음
