목차
- 도메인과 호스팅 환경 분리 이슈
- Safari foreignObject 태그 transform 문제
- 맥북 에어 M3 및 SSD, RAM 구매 고민
- 애플 칩셋별 SSD 속도 차이와 성능
- 맥북 프로와 그래픽 카드 성능 비교
- Adobe 소프트웨어와 맥북 성능 이슈
- 리액트 네이티브로 링크드인 같은 서비스 개발 가능성
- 커뮤니티 대화 및 잡담 흐름
1. 도메인과 호스팅 환경 분리 이슈 🔗
- 같은 도메인에서 데스크탑과 모바일 버전을 각각 다른 호스팅 방식(Firebase Hosting, GCF)으로 운영할 수 있냐는 질문이 있었음.
- 현실적으로 같은 도메인 혹은 서브도메인이라도 서버가 다르면 각각의 호스팅을 병행하기 힘듦.
- 일반적인 해결책은 도메인을 새로 따거나 리다이렉트를 이용해 특정 접속 환경에 따라 서버를 분리하는 방법.
- 서브도메인도 엄밀히 따지면 ‘같은 도메인’로 분류하지만, 서버 위치에 따라서 독립적인 호스팅이 필요함.
- 복수 호스팅 환경의 구축은 DNS 설정, 리버스 프록시, 클라우드 설정을 잘 다뤄야 가능.
용어 설명:
- Firebase Hosting: 구글의 서버리스 정적 웹호스팅 서비스. 빠르고 간편하지만 서버 측 로직은 별도로 처리 필요.
- GCF(Google Cloud Functions): 함수 단위로 서버리스 백엔드를 실행하는 플랫폼으로, 동적 콘텐츠 호스팅에 주로 사용됨.
- 리다이렉트: 방문자가 특정 URL로 접속했을 때 자동으로 다른 URL로 이동시키는 기법.
2. Safari foreignObject 태그 transform 문제 🐦
- Safari 브라우저에서 SVG 내 <foreignObject> 태그 내부 특정 요소에 opacity를 설정하면,
부모 <foreignObject>에 적용된 transform: scale()이 적용되지 않는 현상 발생 문의. - 이는 Safari의 렌더링 엔진이 foreignObject 내부 스타일과 SVG 변환(transform) 렌더링 간 충돌이 있어 발생하는 버그로 추정됨.
- 대안으로 foreignObject 내부 요소에 직접 transform을 적용하거나, opacity 대신 다른 방법(visibility 변경 등)을 시도해야 할 수도 있음.
용어 설명:
- foreignObject 태그: SVG 내에서 HTML과 같은 외부 XML 네임스페이스 콘텐츠를 삽입하는 태그.
- transform: scale(): CSS 변환 속성으로 요소 크기를 배율에 따라 확대/축소함.
- opacity: 불투명도 조정 CSS 속성. 0에 가까울수록 투명함.
3. 맥북 에어 M3 및 저장장치, 메모리 구매 고민 🍎💻
- M3 맥북 에어를 램 16GB, SSD 516GB로 구매하면 충분한지 질문이 있었음.
- SSD 용량은 개인 사용량에 따라 다르지만, 256GB도 충분한 경우가 많음. 실제 사용하는 용량이 적은 사용자들이 많음.
- SSD 구조 상 용량이 절반 이상 사용되면 성능 저하 우려는 과거 이야기일 수 있으나, 최신 칩셋은 개선 상황.
- RAM 8GB보다 16GB가 훨씬 쾌적한 작업 환경 제공, 특히 포토샵, 라이트룸 같은 무거운 프로그램 사용 시 중요.
- ‘에어’가 쿨러가 없고 무거운 작업에 적합하지 않아 가벼운 작업용으로 적합하다는 의견 많음.
- 프로 모델은 더 높은 성능을 제공하지만 가격 차이가 큼.
4. 애플 칩셋별 SSD 성능 이슈 및 속도 차이 🔍
- M1·M2 칩셋에서 SSD 용량별 속도 차이가 이야기됐는데, 용량이 클수록 속도가 더 빠른 경우가 있음.
- M1은 용량별 SSD가 별개의 칩으로 구성되어 있고, M2부터 단일 칩으로 바뀌어 내부 구조 변화 있음.
- 큰 SSD 용량이 속도에 일부 영향을 주는 경우 있으나, 일상 사용에서는 체감 차이는 크지 않을 수 있음.
- 저장 속도를 제대로 활용하려면 CPU나 전체 시스템 성능도 뒷받침돼야 함.
5. 맥북 프로와 그래픽 카드 성능 비교 ⚔️
- 고성능 작업용으로 NVIDIA RTX 4090 워크스테이션 대비 맥북 프로의 한계 토론.
- 맥북 프로가 휴대성과 안정성은 좋지만, 그래픽 연산 성능에서는 데스크탑의 고성능 GPU에 비해 한계가 명확.
- 애플 M 시리즈 GPU는 숫자가 많아 보여도 실제 성능은 NVIDIA 최신 GPU 대비 낮을 수 있음.
- 실제 그래픽 및 CUDA 최적화 작업에는 NVIDIA GPU가 우세.
6. Adobe 소프트웨어와 맥북 성능 이슈 📷🎨
- 포토샵, 라이트룸, 애프터 이펙트(애펙) 같은 Adobe 제품은 맥북, 특히 M1/M2 기반에서 가끔 퍼포먼스가 떨어지는 경험 사례 공유.
- 특히 렌더링, 이미지 편집 같은 무거운 작업에서 성능 부족 느낌.
- 아이폰과 색깔 매칭을 위해 불가피하게 맥북 사용해야 하는 상황 발생.
- 전반적으로 무거운 작업에는 전문가용 프로세서와 많은 램, 빠른 스토리지 필수.
7. 리액트 네이티브로 링크드인 같은 서비스 개발 가능성 📱🖥
- 질문: 리액트 네이티브로 링크드인 웹, 앱 수준의 복합 서비스를 만들 수 있을까?
- 답변 요약: 가능은 하지만, 링크드인 안드로이드 앱은 본래 네이티브 코드 임.
- 리액트 네이티브는 크로스플랫폼 앱 개발 프레임워크로, 웹뷰(webview)를 활용하는 경우도 있으나 성능 및 UX 차이 존재.
- 클라이언트의 요구사항에 따라 적합한 플랫폼 선정 및 기술 스택 결정 필요.
- 앱 서비스 개발 시 네이티브 개발자 참여 중요성도 언급됨.
용어 설명:
- 리액트 네이티브(React Native): 자바스크립트로 모바일 앱을 개발할 수 있게 해주는 페이스북 오픈소스 프레임워크.
- 웹뷰(WebView): 앱 내에서 웹 페이지를 불러와 보여주는 컴포넌트.
8. 커뮤니티 대화 및 잡담 흐름 💬
- 주말인데도 활동하는 개발자 소수, 대화 내용은 주로 개발 정보, 맥북 신제품, 게임, 취미 등 자유로운 분위기.
- 많은 참가자가 맥북 사양, 가격, SSD 용량과 RAM, 그래픽카드 성능에 대해 서로 의견 공유함.
- 웃음과 농담 섞인 대화 다수 포함, 친근한 개발자 커뮤니티 문화 엿볼 수 있었음.
면접팁⚡
- 도메인 분리와 호스팅 배포 문제:
- "같은 도메인에서 서로 다른 서버 환경을 어떻게 운영할 수 있는가?" 질문에
- DNS, 서브도메인, 리버스 프록시, CDN, 클라우드 함수 활용 방법으로 답변할 수 있어야 함.
- 웹 브라우저 호환성 문제:
- "SVG foreignObject 관련 Safari 호환성 문제와 해결책"에 대해 설명할 수 있어야 함.
- 클라우드 및 서버리스 아키텍처 이해:
- Firebase Hosting, GCF 등 서버리스 환경 차이를 명확히 설명하는 능력 필요.
- React Native 장단점:
- 크로스 플랫폼 vs 네이티브 개발 차이점과 실제 서비스 사례를 들어 답변 준비.
- 제품별 하드웨어 성능 비교:
- MacBook M1/M2/M3 칩셋 구조 및 SSD, RAM 사양이 성능에 미치는 영향과 실제 사용경험 공유 가능.
링크🔗
- M3 MacBook Air 및 성능 분석 영상: https://youtu.be/Bw7Zu3LoeG8?si=xdP8Pakti5rGaEHm
- React Native 관련 트위터 링크: https://twitter.com/adamwathan/status/1734696245015494711
#도메인호스팅#맥북에어#SSD속도#ReactNative#Safari버그#애플칩셋#웹앱개발#프론트엔드#성능이슈#기술토론